prefers-color-scheme for links, footer, and table-of-contents

Author: peterbecich

datafiles/static/hackage.css

@@ -78,14 +78,8 @@ dd {
 a { text-decoration: none; }
 
 @media (prefers-color-scheme: dark) {
-  a[href]:link {
-    color: #9E358F;
-    filter: brightness(2.0);
-  }
-  a[href]:visited {
-    color: #6F5F9C;
-    filter: brightness(2.0);
-  }
+  a[href]:link { color: #EB82DC; }    /* 30% brighter */
+  a[href]:visited { color: #D5C5FF; } /* 40% brighter */
 }
 @media (prefers-color-scheme: light) {
   a[href]:link { color: #9E358F; }
@@ -442,7 +436,6 @@ table.properties td, table.properties th {
   }
 
   div #properties {
-      background: #fefefe;
       width: 40%;
       margin-bottom: 2em;
   }
@@ -623,11 +616,21 @@ div#style-menu-holder {
   display: block;
 }
 
+@media (prefers-color-scheme: dark) {
+  #footer {
+    background: #222;
+    color: #ededed;
+  }
+}
+@media (prefers-color-scheme: light) {
+  #footer {
+    background: #ededed;
+    color: #222;
+  }
+}
 #footer {
-  background: #ededed;
   border-top: 1px solid #aaa;
   padding: 0.5em 0;
-  color: #222;
   text-align: center;
   width: 100%;
   height: 3em;
@@ -665,8 +668,17 @@ ul.links li form button {
 
 /* @group Front Matter */
 
+@media (prefers-color-scheme: dark) {
+  #table-of-contents {
+    background: #222;
+  }
+}
+@media (prefers-color-scheme: light) {
+  #table-of-contents {
+    background:  #f7f7f7;
+  }
+}
 #table-of-contents {
-  background:  #f7f7f7;
   padding: 1em;
   margin: 0;
   margin-top: 1em;