Files
Peter Steinberger 8e6c34fba3 feat(ui): user-selectable accent color for the Control UI (#128432)
* feat(ui): user-selectable accent color for the Control UI

Adds an Accent color section to Settings -> Appearance: curated preset
swatches plus a native custom color input. The choice persists as the
gateway-synced ui.prefs.accent (#rrggbb) and takes precedence over the
operator-level ui.seamColor, falling back to the active theme's accent
when cleared. The shared apply path now also derives readable
--accent-foreground/--primary-foreground ink from accent luminance, so
light accents keep dark text on primary controls.

Bundled accent-invariant cleanup: the embedded terminal resolves its
background/cursor/foreground from live computed tokens instead of a
hand-copied claw palette (fixes desync on knot/dash/custom themes),
a baked rgba(255,92,92) gradient now uses color-mix over --accent, and
duplicated diff-tint literals collapse into --danger-subtle/--ok-subtle.
Environment branding moved behind a lazy runtime module (-2.5KB gzip
startup JS).

* fix(ui): derive status glows and tints from semantic tokens

Status-dot glows, callout gradients, compaction-indicator borders, chip
borders, and dreams pulse animations baked literal green/blue/amber/red
rgba values -- several stale copies of old --danger/--info hexes -- so
they ignored theme families and light mode's deeper status hues. All 22
sites now color-mix over --ok/--warn/--warn-strong/--danger/--info.

* fix(ui): scope default accent swatch chip vars to a swatch class

Reusing .settings-theme-card--<theme> on the accent swatch made theme-card
Playwright locators resolve to two elements (strict-mode violation in the
prefs-reconnect e2e suite). The default swatch now uses
.settings-accent-theme--<theme>, added alongside the theme-card selectors
in the theme-invariant chip var blocks.

* fix(ui): carry --primary-hover through the accent override

The accent apply path set --primary but not --primary-hover, so dark
Claw/Knot primary buttons reverted to the theme hover color while an
accent was active (ClawSweeper P2). Derive it from --primary like the
accent hover, clear it on reset, and prove the resolved hover color via
a painted probe in the appearance e2e.
2026-08-23 20:32:05 -07:00
..