feat: add neon-glow to theme selector and apply body class on theme switch

- Add "neon-glow" entry to THEMES in settings/helpers.ts
- Update applyTheme() to also toggle theme-<name> class on document.body
- Update UiState and setTheme() in ui.store.ts to include "neon-glow"
This commit is contained in:
jevb
2026-03-27 12:09:47 +01:00
parent 4d63368a51
commit 9a9464a8de
2 changed files with 7 additions and 2 deletions
@@ -12,6 +12,7 @@ export const STORAGE_PREFIX = "owncord:settings:";
export const THEMES = {
dark: { "--bg-primary": "#313338", "--bg-secondary": "#2b2d31", "--bg-tertiary": "#1e1f22", "--text-normal": "#dbdee1" },
"neon-glow": { "--bg-primary": "#1a1b1e", "--bg-secondary": "#111214", "--bg-tertiary": "#0d0e10", "--text-normal": "#dbdee1" },
midnight: { "--bg-primary": "#1a1a2e", "--bg-secondary": "#16213e", "--bg-tertiary": "#0f3460", "--text-normal": "#e0e0e0" },
light: { "--bg-primary": "#ffffff", "--bg-secondary": "#f2f3f5", "--bg-tertiary": "#e3e5e8", "--text-normal": "#313338" },
} as const;
@@ -90,4 +91,8 @@ export function applyTheme(name: ThemeName): void {
for (const [prop, val] of Object.entries(vars)) {
root.style.setProperty(prop, val);
}
for (const cls of [...document.body.classList]) {
if (cls.startsWith("theme-")) document.body.classList.remove(cls);
}
document.body.classList.add(`theme-${name}`);
}
+2 -2
View File
@@ -10,7 +10,7 @@ export interface UiState {
readonly memberListVisible: boolean;
readonly settingsOpen: boolean;
readonly activeModal: string | null;
readonly theme: "dark" | "midnight" | "light";
readonly theme: "dark" | "neon-glow" | "midnight" | "light";
readonly connectionStatus: "connected" | "reconnecting" | "disconnected";
readonly transientError: string | null;
readonly persistentError: string | null;
@@ -84,7 +84,7 @@ export function closeModal(): void {
}
/** Set the UI theme. */
export function setTheme(theme: "dark" | "midnight" | "light"): void {
export function setTheme(theme: "dark" | "neon-glow" | "midnight" | "light"): void {
uiStore.setState((prev) => ({
...prev,
theme,