fix dark map in light mode

src/components/partials/DarkMode.vue

@@ -13,7 +13,7 @@
 import { useDark, useToggle } from "@vueuse/core";
 
 const isDark = useDark({
-        selector: "body", //element to add attribute to
+        selector: "html", //element to add attribute to
         attribute: "theme", // attribute name
         valueDark: "dark", // attribute value for dark mode
         valueLight: "light", // attribute value for light mode

src/components/relays/blocks/MapSummary.vue

@@ -306,7 +306,7 @@ export default defineComponent({
 </script>
 
 <style>
-:root {
+/* :root {
     --map-tiles-filter: brightness(0.6) invert(1) contrast(3) hue-rotate(200deg) saturate(0.3) brightness(0.7);
 }
 
@@ -314,7 +314,7 @@ export default defineComponent({
     .leaflet-tile {
         filter:var(--map-tiles-filter, none);
 	}
-}
+} */
 </style>
 
 <style>

src/styles/main.scss

@@ -3,10 +3,6 @@
 @tailwind components;
 @tailwind utilities;
 
-:root {
-    --map-tiles-filter: brightness(0.6) invert(1) contrast(3) hue-rotate(200deg) saturate(0.3) brightness(0.7);
-}
-
 .toggle-dark-mode {
   width:32px;
   height:32px;
@@ -16,7 +12,13 @@
   background-color: rgba(255,255,255, .5)
 }
 
-body[theme=dark] {
+:root {
+  --map-tiles-filter: brightness(0.6) invert(1) contrast(3) hue-rotate(200deg) saturate(0.3) brightness(0.7);
+}
+
+//TODO: When building out the stylesheet, convert these to WS dark: conditional.
+
+html[theme=dark] {
   background: #16171d;
   color: #fff;