vince/dimensionlab-website
1
0
Fork 0
Code Issues 5 Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): align theme toggle with dashboard style

Browse source
This commit is contained in:
vince 2026-06-20 01:33:27 +02:00
parent c84de9aaa9
commit 9c948bd746
7 changed files with 99 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/lib/ui/components/render.test.tsx
View file

@ -6,6 +6,7 @@ import { FooterCell } from "./FooterCell";
import { IconButton } from "./IconButton";
import { ServiceRow } from "./ServiceRow";
import { TelemetryCard } from "./TelemetryCard";
import { ThemeToggle } from "./ThemeToggle";
import { dashboardPreviewFixtures } from "../fixtures";
describe("dashboard UI components", () => {
@ -144,4 +145,20 @@ describe("dashboard UI components", () => {
expect(iconButton).toContain("class=\"icon-button custom-icon-action ");
expect(iconButton).toContain("aria-expanded=\"false\"");
});
test("renders the theme toggle as a segmented instrument control", () => {
const body = renderToString(
<ThemeToggle theme="light" onThemeChange={() => undefined} />,
);
expect(body).toContain('class="theme-toggle"');
expect(body).toContain('data-ui-theme-current="light"');
expect(body).toContain('aria-label="Switch to dark theme"');
expect(body).toContain('class="theme-toggle__label"');
expect(body).toContain('class="theme-toggle__switch"');
expect(body).toContain('data-active="true"');
expect(body).toContain("Theme");
expect(body).toContain("Dark");
expect(body).toContain("Light");
});
});