[tor-commits] [snowflake/master] Popup CSS for dark mode.

[dcf@xxxxxxxxxxxxxx]

commit 36815bd57bcc1e91fcd4dd8d7ddff5b7e1d8850e
Author: David Fifield <david@xxxxxxxxxxxxxxx>
Date:   Tue Jul 23 10:14:37 2019 -0600

    Popup CSS for dark mode.
    
    In Firefox, this requires version 67 for support for
    prefers-color-scheme media queries.
    https://hacks.mozilla.org/2019/05/firefox-67-dark-mode-css-webrender/
    To force Firefox into dark mode, set ui.systemUsesDarkTheme=1 (and
    optionally browser.in-content.dark-mode=true, to put pages such as
    about:addons into dark mode as well) in about:config. You can check if
    it's working at https://bugzilla.mozilla.org/, which has its own
    dark-mode styling. Note that this kind of dark mode is *independent* of
    the "Dark" theme that can be selected in about:addons.
    
    Chrome requires version 76 for prefers-color-scheme. You can force it by
    running with the --force-dark-mode command-line option.
---
 proxy/static/embed.css | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

diff --git a/proxy/static/embed.css b/proxy/static/embed.css
index 156a688..4a58d45 100644
--- a/proxy/static/embed.css
+++ b/proxy/static/embed.css
@@ -121,3 +121,27 @@ input:checked + .slider:before {
   -ms-transform: translateX(13px);
   transform: translateX(13px);
 }
+
+/* Dark Mode */
+@media (prefers-color-scheme: dark) {
+  body {
+    /* https://design.firefox.com/photon/visuals/color.html#dark-theme */
+    color: white;
+    background-color: #38383d;
+  }
+  #statusimg {
+    background-image: url("assets/status-off-dark.png");
+  }
+  #statusimg.on {
+    background-image: url("assets/status-on-dark.png");
+  }
+  #statusimg.on.running {
+    background-image: url("assets/status-running.png");
+  }
+  input:checked + .slider {
+    background-color: #cc80ff;
+  }
+  input:focus + .slider {
+    box-shadow: 0 0 1px #cc80ff;
+  }
+}



_______________________________________________
tor-commits mailing list
tor-commits@xxxxxxxxxxxxxxxxxxxx
https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-commits