diff --git a/src/lib/components/LocationDialog.svelte b/src/lib/components/LocationDialog.svelte index 919fc26..6a68684 100644 --- a/src/lib/components/LocationDialog.svelte +++ b/src/lib/components/LocationDialog.svelte @@ -125,7 +125,7 @@ position: fixed; inset: 0; z-index: 2500; background: transparent; border: none; padding: 0; margin: 0; width: 100vw; height: 100vh; cursor: default; } .ctx { - position: absolute; z-index: 2600; width: 300px; background: #fff; color: #0f172a; + position: fixed; z-index: 2600; width: 300px; background: #fff; color: #0f172a; border-radius: 10px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3); padding: 12px 14px; font: 0.8rem system-ui, sans-serif; } diff --git a/src/lib/components/MapView.svelte b/src/lib/components/MapView.svelte index a199cc9..cbba7e4 100644 --- a/src/lib/components/MapView.svelte +++ b/src/lib/components/MapView.svelte @@ -325,10 +325,13 @@ // Open the context dialog at a lat/lon. `feature` null => treat as a bare // map spot (offer save). We also check whether this spot is a saved point. function openContextAt(latlng: L.LatLng, featureInfo: { name: string; rows: [string, string][] } | null) { + // containerPoint is relative to the map container; convert to viewport + // coords so the (fixed-positioned) dialog aligns exactly with the click. const xy = map.latLngToContainerPoint(latlng); + const rect = map.getContainer().getBoundingClientRect(); const sp = findSavedPointNear(latlng.lat, latlng.lng); ctx = { - x: xy.x, y: xy.y, lat: latlng.lat, lon: latlng.lng, + x: rect.left + xy.x, y: rect.top + xy.y, lat: latlng.lat, lon: latlng.lng, feature: featureInfo, savedPoint: sp?.id ? sp : null };