fix: marker opacity feature

mfrederic · Dec 22, 2024 · 785b16d · 785b16d
1 parent 1dd1508
commit 785b16d
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/frontend/src/components/Map/MapEvents.tsx b/frontend/src/components/Map/MapEvents.tsx
@@ -29,7 +29,8 @@ export function MapEvents() {
     document
       .querySelectorAll('.marker-svg')
       .forEach((el) => {
-        el.setAttribute('style', `opacity: ${markerOpacity}`);
+        el.className = el.className.replace(/opacity-\d+/, '');
+        el.classList.add(`opacity-${markerOpacity * 100}`);
       });
   }, [markerOpacity]);
 

diff --git a/frontend/src/components/Map/MapWrapper.scss b/frontend/src/components/Map/MapWrapper.scss
@@ -70,3 +70,9 @@
 img.selected {
   filter: drop-shadow(0 6px 6px #000);
 }
+
+@for $i from 0 through 20 {
+  .opacity-#{$i * 5} {
+    opacity: #{$i * 0.05};
+  }
+}