From: David Kerkeslager <kerkeslager@gmail.com>
Date: Mon, 17 Aug 2020 18:55:13 +0000 (-0400)
Subject: Fiddle the color palette a bit
X-Git-Url: https://code.kerkeslager.com/?p=styx.blog;a=commitdiff_plain;h=0002b6ab78f1beeecb608e03f4a22bbb1456a3ed

Fiddle the color palette a bit
---

diff --git a/core/templates/core/style.css b/core/templates/core/style.css
index 9e38a57..3e7ea09 100644
--- a/core/templates/core/style.css
+++ b/core/templates/core/style.css
@@ -1,8 +1,19 @@
+{% with dark_background='#121212' dark_foreground='#dfdede' light_background='#ddddd7' light_foreground='#444444' %}
 html {
   height: 100%;
   font-family: "Lucida Grande", Verdana, Arial, sans-serif;
 }
 
+html,
+a,
+a:link,
+a:hover,
+a:visited,
+a:active {
+  color: {{ light_foreground }};
+  background: {{ light_background }};
+}
+
 header, main, footer, p {
   margin: 0;
   padding: 0;
@@ -100,7 +111,7 @@ article:first-of-type {
 }
 
 article:not(:first-of-type) {
-  border-top: 1px solid black;
+  border-top: 1px solid {{ light_foreground }};
   padding-top: 2rem;
 }
 
@@ -135,16 +146,18 @@ nav.pagination:last-child {
 }
 
 @media (prefers-color-scheme: dark) {
-  html {
-    color: #dfdede;
-    background: #121212;
-  }
-
-  a {
-    color: #dfdede;
+  html,
+  a,
+  a:link,
+  a:hover,
+  a:visited,
+  a:active {
+    color: {{ dark_foreground }};
+    background: {{ dark_background }};
   }
 
   article:not(:first-of-type) {
-    border-top: 1px solid #dfdddd;
+    border-top: 1px solid {{ dark_foreground }};
   }
 }
+{% endwith %}