dark-mode: replace hard-coded #fff with the --main-bg property

This is a step in the right direction, there is one more instance of
`#fff` (active drop-down titles) but it will be handled differently
because `--main-bg` would be too dark.

Signed-off-by: Johannes Schindelin <[email protected]>

Author: dscho

assets/sass/application.scss

@@ -35,7 +35,7 @@ code {
 }
 
 pre {
-  background-color: #fff;
+  background-color: var(--main-bg);
   border: solid 1px #efeee6;
   border-radius: 3px;
   color: var(--orange);

assets/sass/forms.scss

@@ -57,7 +57,7 @@ form#search {
 
   &.focus {
     border-color: #007175;
-    background-color: #fff;
+    background-color: var(--main-bg);
   }
 }
 

assets/sass/front-page.scss

@@ -132,12 +132,12 @@ $monitor-height: 271px;
   height: $monitor-height - 45;
   padding-top: 45px;
   padding-left: 40px;
-  color: #fff;
+  color: var(--main-bg);
   text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
 
   h4 {
     font-weight: normal;
-    color: #fff;
+    color: var(--main-bg);
     font-size: 16px;
   }
 
@@ -166,7 +166,7 @@ $monitor-height: 271px;
     padding: 5px 0;
     margin-top: 10px;
     font-size: 16px;
-    color: #fff;
+    color: var(--main-bg);
     text-align: center;
     background-image: linear-gradient(#1c868c, #186368);
     border-top: solid 1px #085e64;

assets/sass/layout.scss

@@ -310,7 +310,7 @@ a.dropdown-trigger {
   position: absolute;
   z-index: 199;
   display: none;
-  background-color: #fff;
+  background-color: var(--main-bg);
   border: solid 1px var(--base-border-color-darker-8);
   @include border-radius(3px);
   @include box-shadow(0 1px 2px #ccc);

assets/sass/lists.scss

@@ -102,7 +102,7 @@ ol#about-nav {
 
       &.current {
         @include background-image-2x($baseurl + "images/icons/nav-circles", 90px, 180px, 0 -90px);
-        color: #fff;
+        color: var(--main-bg);
         opacity: 1;
       }
 

assets/sass/search.scss

@@ -26,7 +26,7 @@
   table {
     width: 100%;
     line-height: 1;
-    background-color: #fff;
+    background-color: var(--main-bg);
     @include border-bottom-right-radius(3px);
     @include border-bottom-left-radius(3px);
 
@@ -60,13 +60,13 @@
 
         &:hover,
         &.highlight {
-          color: #fff;
+          color: var(--main-bg);
           text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
           background: #55bec4;
           background-image: linear-gradient(#55bec4, #54b2b7);
 
           span {
-            color: #fff;
+            color: var(--main-bg);
           }
         }
       }

assets/sass/typography.scss

@@ -260,7 +260,7 @@ code {
   line-height: $fixed-width-line-height;
   font-variant-ligatures: none;
   color: var(--orange);
-  background-color: #fff;
+  background-color: var(--main-bg);
   border: solid 1px #efeee6;
 }