refactor(frontend): simplify theme system and unify UI components

Remove the "casaos" theme in favor of a unified design system. This involves cleaning up conditional styling across components, simplifying the theme toggle, and updating the global CSS variables to a more consistent dark/light mode implementation.

- Remove `casaos` theme from `themes.ts` and `ThemeToggle`
- Refactor `globals.css` to use a single dark mode definition
- Simplify component styling by removing `isCasaOS` conditional logic
- Update UI components (`Card`, `Badge`, `WidgetCard`, etc.) to use standard design tokens
- Update E2E smoke tests to reflect theme changes
This commit is contained in:
Tomas Dvorak
2026-05-04 18:32:35 +02:00
parent eaa9bfda90
commit 9e7acc868d
15 changed files with 154 additions and 447 deletions
+2 -3
View File
@@ -1,11 +1,11 @@
export type Theme = "light" | "dark" | "casaos";
export type Theme = "light" | "dark";
const STORAGE_KEY = "dash-theme";
export function getStoredTheme(): Theme {
if (typeof window === "undefined") return "dark";
const stored = localStorage.getItem(STORAGE_KEY);
if (stored === "light" || stored === "dark" || stored === "casaos") return stored;
if (stored === "light" || stored === "dark") return stored;
return "dark";
}
@@ -22,5 +22,4 @@ export function applyTheme(theme: Theme) {
export const themeLabels: Record<Theme, string> = {
light: "Light",
dark: "Dark",
casaos: "CasaOS",
};