gawells/Stalwart-webui
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Add selectable color themes with a global appearance switcher

Browse Source
This commit is contained in:
Steven RYDELL
2026-07-29 09:40:40 +02:00
parent 0a8dfb44be
commit 2a872d2ccf
6 changed files with 263 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main.tsx
+10 -9
View File
@@ -20,18 +20,19 @@ import { getBasePath } from './lib/basePath';
(() => {
try {
const persisted = localStorage.getItem('stalwart-ui');
if (persisted) {
const parsed = JSON.parse(persisted);
const theme = parsed?.state?.theme;
if (theme === 'dark' || theme === 'light') {
document.documentElement.classList.toggle('dark', theme === 'dark');
return;
}
const state = persisted ? (JSON.parse(persisted)?.state ?? null) : null;
const theme = state?.theme;
const dark = theme === 'dark' || (theme !== 'light' && !!window.matchMedia?.('(prefers-color-scheme: dark)').matches);
document.documentElement.classList.toggle('dark', dark);
const colorTheme = state?.colorTheme;
if (colorTheme === 'ocean' || colorTheme === 'forest' || colorTheme === 'violet') {
document.documentElement.dataset.theme = colorTheme;
}
if (state?.radius === 'square') {
document.documentElement.dataset.radius = 'square';
}
// eslint-disable-next-line no-empty
} catch {}
const prefersDark = window.matchMedia?.('(prefers-color-scheme: dark)').matches;
document.documentElement.classList.toggle('dark', !!prefersDark);
})();
const basePath = getBasePath();