1 files changed, 42 insertions, 4 deletions
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 458589f..524af7f 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -9,7 +9,13 @@
   {{ end }}
 </head>
 
-<body class="light">
+{{ $theme := "auto"}}
+
+{{ with .Param "theme" }}
+{{ $theme = .}}
+{{ end }}
+
+<body class="{{ $theme }}">
 
   <div class="content">
     <header>
@@ -27,13 +33,45 @@
 
 </body>
 
+
 <script>
 
-  function toggleTheme() {
-    document.body.classList.toggle('light');
-    document.body.classList.toggle('dark');
+  function isAuto() {
+    return document.body.classList.contains("auto");
+  }
+
+  function setTheme() {
+    if (!isAuto()) {
+      return
+    }
+
+    console
+    document.body.classList.remove("auto");
+    let cls = "light";
+
+    console.log
+
+    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
+      cls = "dark";
+    }
+
+    document.body.classList.add(cls);
+
+  }
+
+  function invert() {
+    document.body.classList.toggle("dark");
+    document.body.classList.toggle("light");
   }
 
+  if (isAuto()) {
+    console.log("Setting invert listener");
+    window.matchMedia('(prefers-color-scheme: dark)').addListener(invert);
+  }
+
+  setTheme();
+
+
 </script>