Activate automatic dark mode

gollum · Jan 18, 2023 · 7bb97b0 · 7bb97b0
1 parent 4208dbb
commit 7bb97b0
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/lib/gollum/public/gollum/stylesheets/template.scss.erb b/lib/gollum/public/gollum/stylesheets/template.scss.erb
@@ -53,6 +53,9 @@ h6 {
 
     &:before {
       content: url('data:image/svg+xml;utf8,<%= rocticon_css(:link) %>');
+      @media (prefers-color-scheme: dark) {
+        filter: invert(95%) sepia(4%) saturate(753%) hue-rotate(178deg) brightness(88%) contrast(92%);
+      }
     }
 
     &:not(.edit) {
@@ -64,6 +67,9 @@ h6 {
 
       &:before {
         content: url('data:image/svg+xml;utf8,<%= rocticon_css(:pencil) %>');
+        @media (prefers-color-scheme: dark) {
+          filter: invert(95%) sepia(4%) saturate(753%) hue-rotate(178deg) brightness(88%) contrast(92%);
+        }
       }
     }
   }

diff --git a/lib/gollum/templates/layout.mustache b/lib/gollum/templates/layout.mustache
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html data-color-mode="auto" data-light-theme="light" data-dark-theme="dark">
 <head>
   <meta http-equiv="Content-type" content="text/html;charset=utf-8">
   <meta name="MobileOptimized" content="width">