feat(style): add CSS theme system with light/dark mode toggle
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:
@@ -32,6 +32,7 @@ ssr = [
|
||||
hydrate = [
|
||||
"dep:console_error_panic_hook",
|
||||
"dep:wasm-bindgen",
|
||||
"dep:web-sys",
|
||||
"leptos/hydrate",
|
||||
]
|
||||
|
||||
@@ -79,6 +80,8 @@ sqlx = { version = "0.8", features = ["runtime-tokio", "tls-rustls", "sqlite", "
|
||||
console_error_panic_hook = { version = "0.1", optional = true }
|
||||
# Pont entre Rust/WASM et JavaScript : permet d'appeler du JS depuis Rust
|
||||
wasm-bindgen = { version = "0.2", optional = true }
|
||||
# Bindings aux APIs du navigateur : window, document, localStorage, Element...
|
||||
web-sys = { version = "0.3", features = ["Window", "Document", "Element", "Storage"], optional = true }
|
||||
|
||||
# Configuration Leptos lue par get_configuration(Some("Cargo.toml"))
|
||||
# Définit les chemins des fichiers compilés et l'adresse du serveur.
|
||||
|
||||
Reference in New Issue
Block a user