Fix map z-indexing over page

2026-08-06 00:33:23 +02:00 · 2026-01-13 15:52:53 -08:00
parent 888dd0f1a8
commit acc0b4b94c
9 changed files with 35 additions and 9 deletions
@@ -32,6 +32,19 @@ ls /dev/ttyUSB* /dev/ttyACM*

 # macOS
 ls /dev/cu.usbserial-* /dev/cu.usbmodem*
+
+# WSL2
+# Run this in an elevated PowerShell (not WSL) window
+winget install usbipd
+
+# restart console
+
+# find device ID (e.g. 3-8)
+usbipd list
+
+# attach device to WSL
+usbipd bind --busid 3-8
+
 ```

 ## Quick Start
@@ -13,8 +13,8 @@
    <link rel="shortcut icon" href="/favicon.ico" />
    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
    <link rel="manifest" href="/site.webmanifest" />
-    <script type="module" crossorigin src="/assets/index-CEwxDLtB.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-8fUZTDSA.css">
+    <script type="module" crossorigin src="/assets/index-y60a2JR7.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-DZ67iE5i.css">
  </head>
  <body>
    <div id="root"></div>
@@ -92,7 +92,7 @@ export function MapView({ contacts }: MapViewProps) {
      {/* Info bar */}
      <div className="px-4 py-2 bg-muted/50 text-xs text-muted-foreground flex items-center justify-between">
        <span>
-          Showing {mappableContacts.length} contact{mappableContacts.length !== 1 ? 's' : ''} heard in the last 7 days with GPS coordinates
+          Showing {mappableContacts.length} contact{mappableContacts.length !== 1 ? 's' : ''} heard in the last 7 days
        </span>
        <div className="flex items-center gap-3">
          <span className="flex items-center gap-1">
@@ -110,8 +110,8 @@ export function MapView({ contacts }: MapViewProps) {
        </div>
      </div>

-      {/* Map */}
-      <div className="flex-1">
+      {/* Map - z-index constrained to stay below modals/sheets */}
+      <div className="flex-1 relative" style={{ zIndex: 0 }}>
        <MapContainer
          center={[20, 0]}
          zoom={2}
@@ -28,3 +28,16 @@ body {
  width: 100%;
  border-right: none;
 }
+
+/* Constrain Leaflet map z-index to stay below modals/sheets */
+.leaflet-container {
+  z-index: 0 !important;
+}
+
+.leaflet-pane {
+  z-index: 0 !important;
+}
+
+.leaflet-control {
+  z-index: 10 !important;
+}