From 589aab7e3de907f9c64813a69514844a12effaef Mon Sep 17 00:00:00 2001 From: mathieu Date: Fri, 15 May 2026 22:49:17 +0200 Subject: [PATCH] feat(style): add CSS theme system with light/dark mode toggle MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Introduces a global design system using CSS custom properties as design tokens. Light and dark themes are defined via [data-theme] attribute on ; 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 --- Cargo.lock | 1 + Cargo.toml | 3 + index.html | 6 + src/app.rs | 10 +- src/client/mod.rs | 1 + src/client/networks.rs | 65 ++-- src/client/theme.rs | 136 ++++++++ style/rust-ipam.css | 718 +++++++++++++++++++++++++++++++++++++++++ 8 files changed, 901 insertions(+), 39 deletions(-) create mode 100644 src/client/theme.rs create mode 100644 style/rust-ipam.css diff --git a/Cargo.lock b/Cargo.lock index 722686b..9dd4d3c 100644 --- a/Cargo.lock +++ b/Cargo.lock @@ -2015,6 +2015,7 @@ dependencies = [ "tracing", "tracing-subscriber", "wasm-bindgen", + "web-sys", ] [[package]] diff --git a/Cargo.toml b/Cargo.toml index 6f3240b..a36398e 100644 --- a/Cargo.toml +++ b/Cargo.toml @@ -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. diff --git a/index.html b/index.html index bb045c2..e010944 100644 --- a/index.html +++ b/index.html @@ -15,6 +15,12 @@ data-target-name correspond au nom du crate avec underscores (convention Rust). --> + +