diff --git a/.gitignore b/.gitignore index d0bf8a9..2f78989 100644 --- a/.gitignore +++ b/.gitignore @@ -9,6 +9,9 @@ dist .DS_Store .eslintcache +# Local Impeccable live-design session state. +.impeccable/live/ + # Cached downloads of external sources, verified against data/sources.lock.json data/raw/ diff --git a/app/components/HeroOverprint.vue b/app/components/HeroOverprint.vue index 247776b..3c0862b 100644 --- a/app/components/HeroOverprint.vue +++ b/app/components/HeroOverprint.vue @@ -11,6 +11,7 @@ import { useMorphingKey, useMorphTo, } from '~/composables/chars.ts' +import { overprintColor, overprintOpacity } from '~/utils/overprint.ts' const { t, list, locale } = useT() const { flagsOn, outlineOn, visibleRegions, regionIndices } = usePrefs() @@ -94,6 +95,20 @@ const groupCount = computed( () => new Set(forms.value.map((form) => form.group)).size, ) +/** + * A uniform character needs no color encoding and remains ordinary ink. Once + * forms differ, every distinct shape takes an equal color from the same fixed + * five-ink sequence; dense rows lower all plates together rather than + * favoring one of them. + */ +const plateOpacity = computed(() => + groupCount.value === 1 + ? 1 + : overprintOpacity(shown.value, visibleRegions.value), +) +const plateColor = (group: number) => + groupCount.value === 1 ? 'var(--c-ink)' : overprintColor(group) + /** * Walking the forms is the stacked view answering "how many are in here". Once * they are separated the row answers that by itself, and lighting one of them @@ -223,7 +238,7 @@ async function openFromField(event: KeyboardEvent) {