Use consolidated data API in map sheet with shared card component (#100)

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: arielcostas <94913521+arielcostas@users.noreply.github.com>
Co-authored-by: Ariel Costas Guerrero <ariel@costas.dev>

1 files changed, 20 insertions, 7 deletions

diff --git a/src/frontend/app/components/StopMapSheet.css b/src/frontend/app/components/StopMapSheet.css
index 5125ff0..4b0f528 100644
--- a/src/frontend/app/components/StopMapSheet.css
+++ b/src/frontend/app/components/StopMapSheet.css
@@ -27,14 +27,18 @@
 
 .center-btn {
   appearance: none;
-  border: 1px solid rgba(0,0,0,0.15);
-  background: color-mix(in oklab, var(--background-color, #fff) 85%, transparent);
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  background: color-mix(
+    in oklab,
+    var(--background-color, #fff) 85%,
+    transparent
+  );
   color: var(--text-primary, #111);
   padding: 6px;
   border-radius: 6px;
   font-size: 12px;
   line-height: 1;
-  box-shadow: 0 1px 2px rgba(0,0,0,0.15);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
   cursor: pointer;
 }
 
@@ -56,7 +60,7 @@
   background: #2a6df4;
   border: 2px solid #fff;
   border-radius: 50%;
-  box-shadow: 0 1px 2px rgba(0,0,0,0.3);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
 }
 
 .user-dot__pulse {
@@ -73,7 +77,16 @@
 }
 
 @keyframes userPulse {
-  0% { transform: scale(0.6); opacity: 0.8; }
-  70% { transform: scale(1.2); opacity: 0.15; }
-  100% { transform: scale(1.4); opacity: 0; }
+  0% {
+    transform: scale(0.6);
+    opacity: 0.8;
+  }
+  70% {
+    transform: scale(1.2);
+    opacity: 0.15;
+  }
+  100% {
+    transform: scale(1.4);
+    opacity: 0;
+  }
 }