41 lines
1.8 KiB
Markdown
41 lines
1.8 KiB
Markdown
# 048 — Multi-accent and brighter variants for built-in themes
|
|
|
|
## Summary
|
|
|
|
`webapp/src/lib/themes.ts` `BUILTIN_THEMES` (dark, light, red, green,
|
|
blue, yellow, pink, orange) are each essentially monotone with a single
|
|
accent color. The wishlist asks for 2-3 accents per theme, plus brighter
|
|
variants of the more muted presets — e.g. keep the current "Green" as-is
|
|
but give it added accents, and introduce a new, brighter "Light Green";
|
|
similarly add suitable additional accents to the default "Light" and
|
|
"Dark" themes.
|
|
|
|
## Scope
|
|
|
|
- Extend the `ThemeVars` shape (or the built-in theme records) to carry 2-3
|
|
accent colors per theme instead of one, and update anywhere a single
|
|
accent variable is consumed (charts, buttons, highlights) to pick from
|
|
the accent set appropriately.
|
|
- Add accents to existing "Light" and "Dark" defaults.
|
|
- Add accents to existing colour presets (red, green, blue, yellow, pink,
|
|
orange) without changing their current base look.
|
|
- Add new brighter variants alongside the existing muted ones (e.g.
|
|
"Light Green" alongside "Green"), following the same naming pattern for
|
|
any other presets that warrant a brighter counterpart.
|
|
- Update the settings UI preset picker to list the new theme options.
|
|
|
|
## Acceptance criteria
|
|
|
|
- Each built-in theme (existing and new) exposes 2-3 accent colors,
|
|
consumed by at least the chart palette (see ticket 046) so charts
|
|
visibly use more than one accent per theme.
|
|
- New brighter variants (at least "Light Green") are selectable in
|
|
settings and render distinctly brighter than their muted counterpart.
|
|
- Existing theme selections are visually unchanged aside from the added
|
|
accents (no unrelated base color shifts).
|
|
|
|
## Depends on
|
|
|
|
None (pairs well with 047, since accents should apply to
|
|
user-provided/custom styles too where applicable).
|