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 -2
View File
@@ -10,9 +10,9 @@ test("smoke: theme toggle works", async ({ page }) => {
await page.goto("http://localhost:3000");
const toggle = page.getByLabel("Toggle theme");
await toggle.click();
await page.getByText("CasaOS").click();
await page.getByText("Light").click();
const theme = await page.evaluate(() => document.documentElement.getAttribute("data-theme"));
expect(theme).toBe("casaos");
expect(theme).toBe("light");
});
test("smoke: empty state shows add button", async ({ page }) => {