Jobs: add the design token roles the new job flow needs #170

New issue

Closed

opened 2026-08-23 19:46:03 +00:00 by nalum · 1 comment

nalum commented

2026-08-23 19:46:03 +00:00

Owner

Part of the jobs flow redesign. The design handoff (design_handoff_jobs_flow, held outside the repo) is the source; the facts it depends on are repeated here so this issue stands alone.

design/tokens.yaml ships nine roles per mode: surface, card, ink, ink-soft, accent, on-accent, celebrate, danger, line. The job flow needs about fifteen. Five of the nine map across (accent, on-accent, ink, line as the hairline, celebrate as the reward mark). The rest are new:

surface-raised — the in-place edit fill
surface-sunken — sheet footer
border and border-strong — control outline, unticked checkbox and empty pip
a third ink level between ink and ink-soft
error and error-surface — the invalid row ring
destructive and on-destructive — the delete button

Each role is 19 themes by 2 modes, and cmd/tokengen hard-fails any pair below WCAG AA 4.5:1, so every value is authored, not derived by hand. Run make tokens and keep make tokens-check green.

Two corrections to carry over from the design review: sheet and card radius read the per-theme radius token (hearth 12, meadow 22) rather than the fixed 26/16-22 the prototypes draw, and the prototype's Meadow mapping is off by one level, so re-derive it from tokens.yaml.

Blocks the row grammar, which cannot be built without surface-raised, border-strong and the error pair.

Update — the late state needs a tenth role

The design handoff added a late state (#174), and the checklist requires it to
be amber. The palette has no amber but celebrate, which means reward and
celebration. Sharing it would put two meanings on one token — the same fault
the design rejects for the accent left rail.

So either a tenth role (late / warning, 19 themes by 2 modes through the AA
gate) or an explicit, written decision to share celebrate and accept the
collision. Decide here, before the card is built: the row grammar needs the
first six roles, and #174 cannot be built without the amber.

Update — decided: a tenth role, `warning`, with an icon

Add a tenth role, it should be a warning with matching icon.

So the role is warning rather than a jobs-only "late" — it names the state, not
the surface, which lets the calendar and any later surface use it without a
second token.

The icon needs no font work: ⚠ is already in the bundled Eagrai Symbols subset
(web/src/fonts/README.md), so the glyph resolves on both surfaces today. Pair
it with an on-warning ink if the design uses the role as a fill anywhere; the
generator's AA gate gets the final say on both.

Late state usage lives in #174 and #186 — glyph, colour and word together, never
colour alone.

Part of the jobs flow redesign. The design handoff (`design_handoff_jobs_flow`, held outside the repo) is the source; the facts it depends on are repeated here so this issue stands alone. `design/tokens.yaml` ships nine roles per mode: `surface`, `card`, `ink`, `ink-soft`, `accent`, `on-accent`, `celebrate`, `danger`, `line`. The job flow needs about fifteen. Five of the nine map across (`accent`, `on-accent`, `ink`, `line` as the hairline, `celebrate` as the reward mark). The rest are new: - `surface-raised` — the in-place edit fill - `surface-sunken` — sheet footer - `border` and `border-strong` — control outline, unticked checkbox and empty pip - a third ink level between `ink` and `ink-soft` - `error` and `error-surface` — the invalid row ring - `destructive` and `on-destructive` — the delete button Each role is 19 themes by 2 modes, and `cmd/tokengen` hard-fails any pair below WCAG AA 4.5:1, so every value is authored, not derived by hand. Run `make tokens` and keep `make tokens-check` green. Two corrections to carry over from the design review: sheet and card radius read the per-theme `radius` token (hearth 12, meadow 22) rather than the fixed 26/16-22 the prototypes draw, and the prototype's Meadow mapping is off by one level, so re-derive it from `tokens.yaml`. **Blocks the row grammar**, which cannot be built without `surface-raised`, `border-strong` and the error pair. --- ## Update — the late state needs a tenth role The design handoff added a late state (#174), and the checklist requires it to be amber. The palette has no amber but `celebrate`, which means reward and celebration. Sharing it would put two meanings on one token — the same fault the design rejects for the accent left rail. So either a tenth role (`late` / `warning`, 19 themes by 2 modes through the AA gate) or an explicit, written decision to share `celebrate` and accept the collision. **Decide here, before the card is built:** the row grammar needs the first six roles, and #174 cannot be built without the amber. --- ## Update — decided: a tenth role, `warning`, with an icon > Add a tenth role, it should be a warning with matching icon. So the role is `warning` rather than a jobs-only "late" — it names the state, not the surface, which lets the calendar and any later surface use it without a second token. The icon needs no font work: **⚠ is already in the bundled Eagrai Symbols subset** (`web/src/fonts/README.md`), so the glyph resolves on both surfaces today. Pair it with an `on-warning` ink if the design uses the role as a fill anywhere; the generator's AA gate gets the final say on both. Late state usage lives in #174 and #186 — glyph, colour and word together, never colour alone.

nalum added the

enhancement

android

web

labels

2026-08-23 19:46:03 +00:00

nalum referenced this issue

2026-08-23 19:46:30 +00:00

Order of work for the jobs flow redesign (#170-#183) #184

nalum referenced this issue

2026-08-23 21:58:05 +00:00

Jobs: the board card, five states on one silhouette #174