diff --git a/docs/index.html b/docs/index.html index 3288e5e4..9cfcb27a 100644 --- a/docs/index.html +++ b/docs/index.html @@ -14,9 +14,17 @@ } body { - /* Background color for what is not covered by the egui canvas, + /* Light mode background color for what is not covered by the egui canvas, or where the egui canvas is translucent. */ - background: #404040; + background: #909090; + } + + @media (prefers-color-scheme: dark) { + body { + /* Dark mode background color for what is not covered by the egui canvas, + or where the egui canvas is translucent. */ + background: #404040; + } } /* Allow canvas to fill entire web page: */ diff --git a/egui_demo_lib/src/wrap_app.rs b/egui_demo_lib/src/wrap_app.rs index 490404e6..15f2a1fa 100644 --- a/egui_demo_lib/src/wrap_app.rs +++ b/egui_demo_lib/src/wrap_app.rs @@ -42,8 +42,8 @@ impl epi::App for WrapApp { fn setup( &mut self, - ctx: &egui::CtxRef, - frame: &mut epi::Frame<'_>, + _ctx: &egui::CtxRef, + _frame: &mut epi::Frame<'_>, storage: Option<&dyn epi::Storage>, ) { #[cfg(feature = "persistence")] diff --git a/egui_glium/src/backend.rs b/egui_glium/src/backend.rs index e11b8f24..f90262aa 100644 --- a/egui_glium/src/backend.rs +++ b/egui_glium/src/backend.rs @@ -151,6 +151,7 @@ fn integration_info( ) -> epi::IntegrationInfo { epi::IntegrationInfo { web_info: None, + prefer_dark_mode: None, // TODO: figure out system default cpu_usage: previous_frame_time, seconds_since_midnight: seconds_since_midnight(), native_pixels_per_point: Some(native_pixels_per_point(&display)), diff --git a/egui_web/CHANGELOG.md b/egui_web/CHANGELOG.md index d21da026..5a46040c 100644 --- a/egui_web/CHANGELOG.md +++ b/egui_web/CHANGELOG.md @@ -5,14 +5,17 @@ All notable changes to the `egui_web` integration will be noted in this file. ## Unreleased -### Fixed ⭐ +### Changed 🔧 +* Default to light visuals unless the system reports a preference for dark mode. + +### Fixed 🐛 * Improve alpha blending, making fonts look much better (especially in light mode) * Fix double-paste bug ## 0.12.0 - 2021-05-10 -### Fixed ⭐ +### Fixed 🐛 * Scroll faster when scrolling with mouse wheel. @@ -33,7 +36,7 @@ Contributors: [n2](https://github.com/n2) ### Added ⭐ * Right-clicks will no longer open browser context menu. -### Fixed ⭐ +### Fixed 🐛 * Fix a bug where one couldn't select items in a combo box on a touch screen. @@ -41,18 +44,18 @@ Contributors: [n2](https://github.com/n2) ### Added ⭐ * WebGL2 is now supported, with improved texture sampler. WebGL1 will be used as a fallback. -### Changed +### Changed 🔧 * Slightly improved alpha-blending (work-around for non-existing linear-space blending). -### Fixed ⭐ +### Fixed 🐛 * Call prevent_default for arrow keys when entering text ## 0.7.0 - 2021-01-04 -### Changed +### Changed 🔧 * `http` and `persistence` are now optional (and opt-in) features. -### Fixed ⭐ +### Fixed 🐛 * egui_web now compiled without `RUSTFLAGS=--cfg=web_sys_unstable_apis`, but copy/paste won't work. @@ -60,7 +63,7 @@ Contributors: [n2](https://github.com/n2) ### Added ⭐ * Auto-save of app state to local storage -### Changed ⭐ +### Changed 🔧 * Set a maximum canvas size to alleviate performance issues on some machines * Simplify `egui_web::start` arguments @@ -70,9 +73,9 @@ Contributors: [n2](https://github.com/n2) * Add ability to request a repaint * Copy/cut/paste suppoert -### Changed ⭐ +### Changed 🔧 * Automatic repaint every second -### Fixed ⭐ +### Fixed 🐛 * Web browser zooming should now work as expected * A bunch of bug fixes related to keyboard events diff --git a/egui_web/Cargo.toml b/egui_web/Cargo.toml index 25ae523c..3067f347 100644 --- a/egui_web/Cargo.toml +++ b/egui_web/Cargo.toml @@ -56,8 +56,8 @@ version = "0.3" features = [ "Clipboard", "ClipboardEvent", - "console", "CompositionEvent", + "console", "CssStyleDeclaration", "DataTransfer", "Document", @@ -73,6 +73,7 @@ features = [ "InputEvent", "KeyboardEvent", "Location", + "MediaQueryList", "MouseEvent", "Navigator", "Performance", diff --git a/egui_web/src/backend.rs b/egui_web/src/backend.rs index 3839f22f..34fe6226 100644 --- a/egui_web/src/backend.rs +++ b/egui_web/src/backend.rs @@ -137,6 +137,7 @@ pub struct AppRunner { app: Box, pub(crate) needs_repaint: std::sync::Arc, storage: LocalStorage, + prefer_dark_mode: Option, last_save_time: f64, screen_reader: crate::screen_reader::ScreenReader, #[cfg(feature = "http")] @@ -147,14 +148,24 @@ pub struct AppRunner { impl AppRunner { pub fn new(web_backend: WebBackend, app: Box) -> Result { load_memory(&web_backend.egui_ctx); - let storage = LocalStorage::default(); + let prefer_dark_mode = crate::prefer_dark_mode(); + + if prefer_dark_mode == Some(true) { + web_backend.egui_ctx.set_visuals(egui::Visuals::dark()); + } else { + web_backend.egui_ctx.set_visuals(egui::Visuals::light()); + } + + let storage = LocalStorage::default(); + let mut runner = Self { web_backend, input: Default::default(), app, needs_repaint: Default::default(), storage, + prefer_dark_mode, last_save_time: now_sec(), screen_reader: Default::default(), #[cfg(feature = "http")] @@ -221,6 +232,7 @@ impl AppRunner { web_info: Some(epi::WebInfo { web_location_hash: location_hash().unwrap_or_default(), }), + prefer_dark_mode: self.prefer_dark_mode, cpu_usage: self.web_backend.previous_frame_time, seconds_since_midnight: Some(seconds_since_midnight()), native_pixels_per_point: Some(native_pixels_per_point()), diff --git a/egui_web/src/lib.rs b/egui_web/src/lib.rs index b939344a..ce74e895 100644 --- a/egui_web/src/lib.rs +++ b/egui_web/src/lib.rs @@ -92,6 +92,15 @@ pub fn native_pixels_per_point() -> f32 { } } +pub fn prefer_dark_mode() -> Option { + Some( + web_sys::window()? + .match_media("(prefers-color-scheme: dark)") + .ok()?? + .matches(), + ) +} + pub fn canvas_element(canvas_id: &str) -> Option { use wasm_bindgen::JsCast; let document = web_sys::window()?.document()?; diff --git a/epi/src/lib.rs b/epi/src/lib.rs index 0534f1d0..82231215 100644 --- a/epi/src/lib.rs +++ b/epi/src/lib.rs @@ -279,6 +279,10 @@ pub struct IntegrationInfo { /// If the app is running in a Web context, this returns information about the environment. pub web_info: Option, + /// Does the system prefer dark mode (over light mode)? + /// `None` means "don't know". + pub prefer_dark_mode: Option, + /// Seconds of cpu usage (in seconds) of UI code on the previous frame. /// `None` if this is the first frame. pub cpu_usage: Option,