Add dark mode

mavidser · Oct 14, 2024 · 286ed06 · 286ed06
1 parent 58c3120
commit 286ed06
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 3 deletions.
diff --git a/assets/css/style.css b/assets/css/style.css
@@ -3,4 +3,20 @@ main > p > strong {
     background-clip: border-box;
     background-clip: text;
     color: transparent;
-}
+}
+
+:root[data-color-scheme="dark"] main > p > strong {
+    background: linear-gradient(to right, #FEAC5E, #C779D0, #4BC0C8);
+    background-clip: border-box;
+    background-clip: text;
+    color: transparent;
+}
+
+@media (prefers-color-scheme: dark) {
+    :root[data-color-scheme="auto"] main > p > strong {
+        background: linear-gradient(to right, #FEAC5E, #C779D0, #4BC0C8);
+        background-clip: border-box;
+        background-clip: text;
+        color: transparent;
+    }
+}
diff --git a/config.toml b/config.toml
@@ -16,7 +16,7 @@ summaryLength = 0
     unsafe= true
 
 [params]
-  mode = "light"
+  colorScheme = "auto"
   customCSS = ["/css/style.css"]
   favicon = "/icons/favicon.ico"
   socialBanner = "/icons/banner.png"

diff --git a/themes/rocinante b/themes/rocinante
+13 −2		README.md
+28 −0		assets/css/rocinante-dark.scss
+28 −0		assets/css/rocinante-light.scss
+41 −29		assets/css/rocinante.scss
+7 −1		layouts/_default/baseof.html
+3 −1		layouts/partials/head.html
+2 −0		layouts/partials/listcontent.html
+0 −20		layouts/photos/single.html