docs: enable dark mode switch (#471)

Author: Michael Brewer

docs/stylesheets/extra.css

@@ -4,6 +4,10 @@
 
 .highlight .hll {
     background-color: lavender
+
+    [data-md-color-scheme="slate"] {
+        background-color: rgb(69, 48, 164)
+    }
 }
 
 .md-typeset table:not([class]) {
@@ -25,3 +29,7 @@
 .md-typeset .admonition, .md-typeset details {
     font-size: 0.70rem
 }
+
+[data-md-color-scheme="slate"] {
+    --md-typeset-a-color: rgb(28, 152, 152)
+}

mkdocs.yml

@@ -29,7 +29,17 @@ nav:
 theme:
   name: material
   palette:
-    primary: deep purple
+    - scheme: default
+      primary: deep purple
+      toggle:
+        icon: material/toggle-switch-off-outline
+        name: Switch to dark mode
+    - scheme: slate
+      primary: indigo
+      accent: teal
+      toggle:
+        icon: material/toggle-switch
+        name: Switch to light mode
   features:
     - navigation.sections
     - navigation.expand