Add dark mode using CSS 'filter: invert hue-rotate' trick

osm-americana · Nov 16, 2024 · 9fa541c · 9fa541c
1 parent b50ef87
commit 9fa541c
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/src/index.html b/src/index.html
@@ -22,6 +22,14 @@
         bottom: 0;
         width: 100%;
       }
+
+      /* quick and dirty dark mode hack */
+      @media (prefers-color-scheme: dark) {
+        #map {
+          filter: invert(1) hue-rotate(180deg) saturate(75%);
+        }
+      }
+
       #attribution-logo {
         position: absolute;
         bottom: 10px;