fix(craig-web): --accent used as text on --primary fails dark-mode AA
Summary
Deferred from #596 (closed). --accent is documented as decoration-only ("never carries text contrast", simple-statehouse.toml), but it is used as a text color on a --primary background at services/craig-web/static/css/components.css (.nav-bar__avatar and ~:542/:675 — chip/label text). In dark mode --accent (#cca63b gold) on --primary (#1d4a7d) is ~3.9:1 — below WCAG AA for normal text.
This is a token-misuse (not a raw hex), so it was out of #596 (closed)'s scope and needs a design call on the intended treatment.
Options (design to weigh in)
- Use
--on-primary(white) for the text and keep--accentonly for the decorative mark/border. - Introduce/define an accessible accent-text token, or switch these to
--accent-2(which carries more contrast).
Acceptance criteria
- Each
--accent-as-text site on a--primaryfill clears WCAG AA in light AND dark (or is confirmed large/bold/decorative). -
--accent's decoration-only contract is upheld (or the contract is revised with design).
Relates to #596 (closed).