Skip to content

Commit f8d6277

Browse files
authored
fix(layout): keep confirmation dialogs above map-control panels (#451) (#461)
* fix(layout): keep confirmation dialogs above map-control panels (#451) Map-control panels (e.g. maplibre-gl-basemap-control) append their panel to the map container with `position: absolute; z-index: 1000`. The map area `<main>` was only `position: relative`, so that z-index escaped to the root stacking context and rendered above body-portaled modal dialogs (z-50) such as the layer-removal confirmation, leaving part of the dialog unreadable behind the panel. Make `<main>` an isolating stacking context (`isolation: isolate`) so all map-control panels appended to the map container stay contained below the modal layer. This fixes the reported basemap case and the whole class of map-panel-over-dialog conflicts without touching the shadcn z-index scale (so Radix popovers/selects nested inside dialogs keep working). * Address Claude review feedback - Condense the `<main>` isolate comment to a single line and correct the cited map-panel z-index from 1000 to 10000 (the four control-panel style sheets all use z-index: 10000).
1 parent 53b2b4d commit f8d6277

1 file changed

Lines changed: 2 additions & 1 deletion

File tree

apps/geolibre-desktop/src/components/layout/DesktopShell.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1190,7 +1190,8 @@ export function DesktopShell({
11901190
</SectionErrorBoundary>
11911191
) : null}
11921192
<main
1193-
className={`relative min-w-0 flex-1 overflow-hidden ${
1193+
// `isolate` creates a stacking context so map-panel z-indexes (up to 10000) stay below body-portaled dialogs. See #451.
1194+
className={`relative isolate min-w-0 flex-1 overflow-hidden ${
11941195
layoutOptions.compact ? "min-h-0" : "min-h-72 md:min-h-0"
11951196
}`}
11961197
>

0 commit comments

Comments
 (0)