docs(design): Fjord stays a fifth scheme beside Midnight
The trial is over: the owner kept it. The trial wording goes from the tokens, the scheme list, the lab and DESIGN; B2's own-hue rule still binds any new scheme.
This commit is contained in:
+5
-4
@@ -103,10 +103,10 @@ style guide.
|
||||
own chip), never `--warn`: a score is not a warning. What sits on a picture looks the same in both themes,
|
||||
because the picture does: the broadcast red `--live` under `--live-fg` (never `--danger`: "live" is not an
|
||||
error), `--rating-media` on a poster's scrim, and `--media-chrome` for the always-dark player's menus
|
||||
(owner decision F16). Black and white are the media scrims and their text. Four schemes × dark
|
||||
and light (B2): **Midnight** (blue), **Forest** (cyan), **Slate** (fuchsia), **Matrix** (moss). Each earns its
|
||||
place with its own hue family. **Fjord** (Midnight's navy with a steel-blue accent) is a trial outside that rule: the owner
|
||||
tries it app-wide, then it is folded into Midnight or removed. Normal text ≥ 4.5:1 and a control's edge ≥ 3:1 in **every** scheme and mode.
|
||||
(owner decision F16). Black and white are the media scrims and their text. Five schemes × dark
|
||||
and light (B2): **Midnight** (blue), **Forest** (cyan), **Slate** (fuchsia), **Matrix** (moss) each earn their
|
||||
place with their own hue family; **Fjord** (Midnight's navy with a calm steel-blue accent) is the one kept
|
||||
exception, the calm twin of the vivid Midnight. A new scheme still needs its own hue family. Normal text ≥ 4.5:1 and a control's edge ≥ 3:1 in **every** scheme and mode.
|
||||
[WCAG 1.4.3, 1.4.11] The input edge token is set under Controls (A4). The ≥ 3:1 edge is the field
|
||||
family's (a field, the form's dropdown trigger), whose edge is the only thing that says "type here". A
|
||||
labelled pill (a chip, a toolbar trigger, a tab, a segment) keeps the faint `--border`: its text names it,
|
||||
@@ -617,3 +617,4 @@ pick a density step; it never changes the anatomy or loses an action. [Nielsen #
|
||||
| 2026-09-27 | Segmented rung | `SegmentedToggle` defaults to the toolbar rung (28, `text-xs`); 24 only for a panel's captioned match toggle | The small default | Two toolbars had inherited 10px type from the default beside 28px buttons |
|
||||
| 2026-09-27 | Copy rule (S3g) | One name per feature (the rail may shorten it); four verbs for four meanings; sentence case with the app's places capitalised; "…" when a command asks first; one-sentence messages without a stop; curly quotes; dates relative in lists with the exact minute on hover, three absolute forms; units from Intl, short | Word-for-word names everywhere; the verbs as they were; all lower case; no "…"; always a stop; always absolute dates; long or compact units | The copy survey found 7 EN and 6 HU double names, 22 Delete against 27 Remove, five date shapes and three spellings of a minute; the owner picked every recommended option |
|
||||
| 2026-09-27 | One glyph, one meaning (S4) | Play only for playback or resuming a paused transfer; Retry = `RefreshCw`; reset / revert = `RotateCcw` | Retry drawn with Play | The first UI-review run (Downloads) found a failed row whose Retry showed ▷ in the row and its menu |
|
||||
| 2026-09-27 | Fjord kept | Fjord stays a fifth scheme beside Midnight; the trial wording goes | Fold it into Midnight; remove it | The owner lived with it and likes it; the vivid Midnight stays for those who want it. B2's own-hue rule still binds any new scheme |
|
||||
|
||||
@@ -89,7 +89,7 @@ const SCHEMES: SchemeDef[] = [
|
||||
light: pal("#f4f5f0", "#ffffff", "#dfe3d8", "#161a14", "#5a6352", "#556b2f", "#ffffff"),
|
||||
},
|
||||
{
|
||||
name: "Fjord · steel (trial)",
|
||||
name: "Fjord · steel",
|
||||
dark: pal("#0d1225", "#121931", "#25506e", "#eef1f5", "#9fb0c4", "#5aa1cb", "#0d1225"),
|
||||
light: pal("#f3f6fa", "#ffffff", "#c9d6e3", "#152232", "#4f6278", "#256b8f", "#ffffff"),
|
||||
},
|
||||
@@ -470,7 +470,7 @@ export function BatchB() {
|
||||
id="b2"
|
||||
code="B2"
|
||||
title="The scheme set"
|
||||
rule="Four schemes, four hue families: Midnight blue, Forest cyan, Slate fuchsia, Matrix moss. YouTube and Starship are gone (a user on them lands on Midnight). Fjord is a trial outside the rule (Midnight's family, Playnite's steel accent): folded into Midnight or removed. Rule: an accent is ≥ 30° of OKLCH hue from danger, warn and success, and ≥ 4.5:1 as text and under its button text, dark and light."
|
||||
rule="Five schemes: four hue families — Midnight blue, Forest cyan, Slate fuchsia, Matrix moss — and Fjord, the one kept exception (Midnight's navy, Playnite's calm steel accent). YouTube and Starship are gone (a user on them lands on Midnight). Rule: an accent is ≥ 30° of OKLCH hue from danger, warn and success, and ≥ 4.5:1 as text and under its button text, dark and light."
|
||||
>
|
||||
<div className="grid gap-2 grid-cols-[repeat(auto-fill,minmax(9.5rem,1fr))]">
|
||||
{SCHEMES.flatMap((s) =>
|
||||
|
||||
@@ -1090,11 +1090,11 @@ html[data-scheme="matrix"][data-theme="light"] {
|
||||
--accent-fg: #ffffff;
|
||||
}
|
||||
|
||||
/* Fjord — TRIAL, not yet a member of the set (docs/DESIGN.md decision log, B2 exception, 2026-09-25):
|
||||
Midnight's navy with Playnite's calm — a muted steel-blue accent and steel rules instead of the vivid
|
||||
periwinkle. It shares Midnight's hue family on purpose; the owner tries it app-wide, then it is folded
|
||||
into Midnight or removed (normalizeTheme lands a stored "fjord" on the default either way). Playnite's
|
||||
own accent (#337599) is 3.7:1 as text, so the accent is the same hue lifted to 6.5:1. */
|
||||
/* Fjord — the one scheme outside B2's "own hue family" (docs/DESIGN.md decision log, 2026-09-25 trial,
|
||||
kept 2026-09-27): Midnight's navy with Playnite's calm — a muted steel-blue accent and steel rules
|
||||
instead of the vivid periwinkle. It shares Midnight's hue family on purpose: the owner lived with both
|
||||
and kept both, the vivid and the calm. Playnite's own accent (#337599) is 3.7:1 as text, so the accent
|
||||
is the same hue lifted to 6.5:1. */
|
||||
html[data-scheme="fjord"][data-theme="dark"] {
|
||||
--bg: #0d1225;
|
||||
--surface: #121931;
|
||||
|
||||
@@ -11,8 +11,8 @@ export const SCHEMES: { id: Scheme; name: string; swatch: string }[] = [
|
||||
{ id: "forest", name: "Forest", swatch: "#22d3ee" },
|
||||
{ id: "slate", name: "Slate", swatch: "#e879f9" },
|
||||
{ id: "matrix", name: "Matrix", swatch: "#86a05a" },
|
||||
// A TRIAL outside B2 (Midnight's hue family, DESIGN.md decision log 2026-09-25): folded into
|
||||
// Midnight or removed once the owner has tried it; a stored "fjord" then lands on the default.
|
||||
// The one scheme outside B2's "own hue family": Midnight's navy with a calm steel accent, kept
|
||||
// beside Midnight on purpose (DESIGN.md decision log, trial 2026-09-25, kept 2026-09-27).
|
||||
{ id: "fjord", name: "Fjord", swatch: "#5aa1cb" },
|
||||
];
|
||||
|
||||
|
||||
Reference in New Issue
Block a user