fix(ui): position context dialog in viewport coords (was offset from the click by the header)
All checks were successful
CI / test-and-build (push) Successful in 46s

This commit is contained in:
hermes-explorigin 2026-08-10 21:35:48 +00:00
parent c2051a665b
commit 80e002ff3d
2 changed files with 5 additions and 2 deletions

View File

@ -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; position: fixed; inset: 0; z-index: 2500; background: transparent; border: none; padding: 0; margin: 0; width: 100vw; height: 100vh; cursor: default;
} }
.ctx { .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; border-radius: 10px; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3); padding: 12px 14px;
font: 0.8rem system-ui, sans-serif; font: 0.8rem system-ui, sans-serif;
} }

View File

@ -325,10 +325,13 @@
// Open the context dialog at a lat/lon. `feature` null => treat as a bare // 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. // 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) { 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 xy = map.latLngToContainerPoint(latlng);
const rect = map.getContainer().getBoundingClientRect();
const sp = findSavedPointNear(latlng.lat, latlng.lng); const sp = findSavedPointNear(latlng.lat, latlng.lng);
ctx = { 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, feature: featureInfo,
savedPoint: sp?.id ? sp : null savedPoint: sp?.id ? sp : null
}; };