css: Use more variable colors.

1 files changed, 11 insertions, 10 deletions

diff --git a/assets/mumi.scss b/assets/mumi.scss
index ac0b715..b86235f 100644
--- a/assets/mumi.scss
+++ b/assets/mumi.scss
@@ -148,7 +148,7 @@ h1 {
     clear: both;
     font-size: 16px;
     margin-bottom: 1rem;
-    border-bottom: 1px dashed #ddd;
+    border-bottom: 1px dashed var(--nav-border-color);
     padding: 0px;
     padding-bottom: 1rem;
     color: #586069;
@@ -157,7 +157,7 @@ h1 {
 .comment-box {
     margin-top: 1rem;
     margin-bottom: 2rem;
-    border-top: 1px dashed #ddd;
+    border-top: 1px dashed var(--nav-border-color);
     padding-top: 1rem;
 
     header input {
@@ -249,9 +249,9 @@ nav span.navbar-text {
     position: absolute;
     background: var(--background-color);
     top: 3rem;
-    border: 1px solid #ced4da;
+    border: 1px solid var(--nav-border-color);
     border-top: none;
-    box-shadow: 3px 3px 10px #ddd;
+    box-shadow: 3px 3px 10px var(--nav-border-color);
     padding: 1em;
     z-index: 2;
     color: var(--primary-focus);
@@ -370,7 +370,7 @@ a.message-anchor {
     right: 0;
     top: 100px;
     background: var(--nav-background-color);
-    border: 1px solid #ddd;
+    border: 1px solid var(--nav-border-color);
     border-radius: 5px 0 0 5px;
     padding: .5em;
     z-index: 1;
@@ -405,7 +405,7 @@ a.message-anchor {
     width: 1.2em;
     height: 1.2em;
     border-radius: 3px;
-    color: #fff;
+    color: var(--background-color);
     display: inline-flex;
     justify-content: center;
     align-items: center;
@@ -417,7 +417,7 @@ a.message-anchor {
         height: 48px;
         width: 48px;
         border-radius: 6px;
-        color: #fff;
+        color: var(--background-color);
         display: flex;
         justify-content: center;
         align-items: center;
@@ -466,8 +466,8 @@ details {
 }
 
 .message details {
-    border-top: 2px dotted #efefef;
-    border-bottom: 2px dotted #efefef;
+    border-top: 2px dotted var(--nav-border-color);
+    border-bottom: 2px dotted var(--nav-border-color);
 }
 .message details summary {
     color: #586069;
@@ -486,7 +486,8 @@ details {
 .message .body .multipart + .multipart {
     padding-top: 1rem;
     padding-bottom: 1rem;
-    border-top: 1px dashed #ddd;
+    border-top: 1px dashed;
+    border-color: var(--nav-border-color);
 }
 
 .multipart.application-pgp-signature {