Fixed dark mode compatibility for old browsers.

refer to issue #30

assets/css/_dark/dark-main.scss

@@ -106,42 +106,39 @@
 } // dark-scheme
 
 
-@mixin light-mode-invisible {
-  *[light-mode-invisible] {
-      display: none;
+@mixin set-visible($light-display, $dark-display) {
+  [light-mode-invisible] {
+    display: $light-display;
+  }
+
+  [dark-mode-invisible] {
+    display: $dark-display;
   }
 }
 
-@mixin dark-mode-invisible {
-  *[dark-mode-invisible] {
-      display: none;
-  }
-}
-
-@media (prefers-color-scheme: light) {
-
-  html:not([mode]), html[mode=light] {
-    @include light-mode-invisible;
-  }
-
-  html[mode=dark] {
+@mixin mode-toggle($dark-mode: false) {
+  @if $dark-mode {
+    @include set-visible(inline-block, none);
     @include dark-scheme;
-    @include dark-mode-invisible;
+  } @else {
+    @include set-visible(none, inline-block);
   }
+}
 
-} // light prefers
+html:not([mode]), html[mode=light] {
+  @include mode-toggle();
+}
 
+html[mode=dark] {
+  @include mode-toggle(true);
+}
 
 @media (prefers-color-scheme: dark) {
-
   html:not([mode]), html[mode=dark] {
-    @include dark-scheme;
-    @include dark-mode-invisible;
+    @include mode-toggle(true);
   }
 
   html[mode=light] {
-    @include light-mode-invisible;
+    @include mode-toggle();
   }
-
-} // dark prefers
-
+}

assets/css/_dark/dark-syntax.scss

@@ -6,7 +6,13 @@
 * MIT Licensed
 */
 
-@mixin dark-scheme {
+@mixin box-shadow($val) {
+  -moz-box-shadow: $val;
+  -webkit-box-shadow: $val;
+  box-shadow: $val;
+}
+
+@mixin dark-syntax-scheme {
   /* syntax highlight colors from https://raw.githubusercontent.com/jwarby/pygments-css/master/monokai.css */
   --highlight-pre-bg: #272822;
   --highlight-hll-bg: #272822;
@@ -75,6 +81,7 @@
   /* My styles */
   --highlight-lineno: #6c6c6d;
   --highlight-lineno-border: #3c4042;
+  --highlighter-rouge: #de6b18;
 
   pre {
     color: #818c96; /* override Bootstrap */
@@ -83,16 +90,9 @@
   kbd {
     background-color: black;
   }
-}
 
-@media (prefers-color-scheme: dark) {
-  html:not([mode]), html[mode=dark] {
-    @include dark-scheme;
+  .highlight {
+    @include box-shadow(none);
   }
-}
 
-@media (prefers-color-scheme: light) {
-  html[mode=dark] {
-    @include dark-scheme;
-  }
-}
+} // mixin dark-syntax-scheme