mathieu/rust-ipam
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(style): add CSS theme system with light/dark mode toggle

Browse Source 
Introduces a global design system using CSS custom properties as
design tokens. Light and dark themes are defined via [data-theme]
attribute on <html>; the system preference (prefers-color-scheme)
is the default when no explicit choice is stored.

ThemeToggle component (Auto → Light → Dark cycle) persists the
choice to localStorage and applies it on hydration without flash.
New themes can be added by defining a [data-theme="name"] CSS block
and adding a variant to ThemeChoice.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
mathieu
2026-05-15 22:49:17 +02:00
parent 3aeb74e5bc
commit 589aab7e3d
8 changed files with 901 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@@ -15,6 +15,12 @@
data-target-name correspond au nom du crate avec underscores (convention Rust).
-->
<link data-trunk rel="rust" data-target-name="rust_ipam" />
<!--
Compile style/rust-ipam.css → target/site/pkg/rust-ipam.css
Served by Axum at /pkg/rust-ipam.css and loaded by the <Stylesheet>
component in app.rs.
-->
<link data-trunk rel="css" href="style/rust-ipam.css" />
</head>
<body>
<!--