advanced: add dark mode

author Mike Frysinger <vapier@gentoo.org>

Sun, 10 Dec 2023 02:57:53 +0000 (19:57 -0700)

committer Mike Frysinger <vapier@gentoo.org>

Sun, 10 Dec 2023 02:57:53 +0000 (19:57 -0700)
author Mike Frysinger <vapier@gentoo.org>
Sun, 10 Dec 2023 02:57:53 +0000 (19:57 -0700)
committer Mike Frysinger <vapier@gentoo.org>
Sun, 10 Dec 2023 02:57:53 +0000 (19:57 -0700)
diff --git a/advanced.html b/advanced.html

index 2c6567326f2a88e7845134c3953599807c796f60..6b4bee31a9917378f3e1da91d3f9991fc4c258aa 100644 (file)
--- a/advanced.html
+++ b/advanced.html
@@ -3,6 +3,13 @@
    <head>
      <meta charset='utf-8'/>
      <title>Tabs Backup & Restore</title>
+
+    <link rel='stylesheet' href='dark.css' media='(prefers-color-scheme: dark)'/>
+    <link rel='stylesheet' href='light.css' media='(prefers-color-scheme: light), (prefers-color-scheme: no-preference)'/>
+    <!-- Load theme override asap to help with initial loading/flashing. -->
+    <link rel='stylesheet' href='' id='theme-override'/>
+    <script src="theme-init.js"></script>
+
      <style>
                 ::-webkit-scrollbar {
                 width: 10px;
@@ -16,6 +23,11 @@
                 background-color: #b9b9b9;
         }
  
+         html {
+               background-color: var(--body-color);
+               filter: var(--body-filter);
+         }
+
        body {
                 font-family: Arial;
  
@@ -45,6 +57,7 @@
          vertical-align:middle;
          width:75px;
          height:75px;
+               filter: var(--img-filter);
        }
  
           .menuItem {
author	Mike Frysinger <vapier@gentoo.org>
	Sun, 10 Dec 2023 02:57:53 +0000 (19:57 -0700)
committer	Mike Frysinger <vapier@gentoo.org>
	Sun, 10 Dec 2023 02:57:53 +0000 (19:57 -0700)