First steps at adding default dark mode depending on the browser settingsadd-dark-mode

1 files changed, 23 insertions, 0 deletions

diff --git a/themes/hugo-whisper-theme/assets/scss/style.scss b/themes/hugo-whisper-theme/assets/scss/style.scss
index c02c2a1..661d8e5 100755
--- a/themes/hugo-whisper-theme/assets/scss/style.scss
+++ b/themes/hugo-whisper-theme/assets/scss/style.scss
@@ -85,3 +85,26 @@ body {
   content: url("/pics/element-small.png") ;
   margin-right: 5px;
 }
+@media (prefers-color-scheme: dark) {
+  html {
+    filter: invert(95%);
+  }
+  a {
+    filter: invert(100%);
+  }
+  .docs-menu a {
+    filter: invert(10%);
+  }
+  .docs-menu a:hover {
+    filter: invert(100%);
+  }
+  li.active {
+    filter: invert(100%);
+  }
+  .zerostatic {
+    filter: invert(100%);
+  }
+  .element-img {
+    filter: invert(100%);
+  }
+}