Add multi-accent palettes and a brighter Light Green theme (ticket 048)

Every built-in theme now exposes three accents (--c-accent/-2/-3) instead
of one, so PanelChart's series palette draws distinct colours per theme
via color-mix() rather than a fixed, theme-independent hex list. Existing
presets keep their current base surface/border/text/accent look — the two
new accent vars are purely additive. Adds a new "Light Green" scheme
(light-surfaced, same green/magenta hue family as "Green") selectable
alongside the existing built-ins, both in ColorScheme (frontend + backend)
and the settings picker.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XFUNZwCvz3kcod3352ZR2o
This commit is contained in:
Hugh Kaznowski
2026-09-06 02:11:33 +01:00
co-authored by Claude Sonnet 5
parent 19044753c6
commit 5371d3e283
7 changed files with 142 additions and 5 deletions
+8 -2
View File
@@ -27,8 +27,14 @@ const COLOR_SCHEMES: ColorScheme[] = [
'yellow',
'pink',
'orange',
'light_green',
]
/** Display label for a `ColorScheme`: underscores become spaces so `capitalize` (which titles each word) renders e.g. "light_green" as "Light Green". */
function schemeLabel(scheme: ColorScheme): string {
return scheme.replace(/_/g, ' ')
}
export function NavMenu({ stats }: { stats: Stats | null }) {
const [openPanel, setOpenPanel] = useState<PanelName>(null)
const panel = useSettingsPanel()
@@ -307,14 +313,14 @@ function SettingsPanel({ panel }: { panel: ReturnType<typeof useSettingsPanel> }
: 'border-border-soft text-text-muted hover:bg-surface-2'
}`}
>
{scheme}
{schemeLabel(scheme)}
</button>
{scheme !== 'system' && (
<button
type="button"
onClick={() => downloadBuiltinTheme(scheme)}
className="rounded-r border border-l-0 border-border-soft px-1.5 py-1 text-xs text-text-faint hover:bg-surface-2 hover:text-text"
aria-label={`Download ${scheme} theme`}
aria-label={`Download ${schemeLabel(scheme)} theme`}
title="Download as .css"
>
↓