other minor styling fixes for gatekeeper modal, position circles

This commit is contained in:
Disco DeDisco
2026-04-01 23:12:49 -04:00
parent 0e5e39b0dc
commit afe79f1a48

View File

@@ -302,14 +302,20 @@ $pos-d-x: round($pos-d * 0.5); // 55px
$pos-d-y: round($pos-d * 0.866); // 95px
// ─── Position strip ────────────────────────────────────────────────────────
// Numbered gate-slot circles rendered above the backdrop (z 130 > overlay 120
// > backdrop 100). .room-page is position:relative with no z-index, so its
// absolute children share the root stacking context with the fixed overlays.
// When role-select is open, suppress pointer events so the strip doesn't
// intercept clicks on cards (landscape: strip overlaps centered card fan).
// Numbered gate-slot circles sit above the gate backdrop/overlay (z 130 > 120
// > 100) but below the role-select fan (z 200), tray (310), and menus (310+).
// .room-page is position:relative with no z-index, so its absolute children
// share the root stacking context with the fixed overlays.
// When the gate modal or role-select fan is open, suppress pointer events so
// the strip doesn't intercept clicks or hover effects on the modal beneath it
// (landscape: strip overlaps centered card fan too).
// Must target .gate-slot directly — it has an explicit pointer-events: auto
// override that wins over a rule on the parent .position-strip alone.
html:has(.gate-backdrop) .position-strip .gate-slot,
html:has(.role-select-backdrop) .position-strip .gate-slot { pointer-events: none; }
// Re-enable clicks on confirm/reject/drop-token forms inside slots
html:has(.gate-backdrop) .position-strip .gate-slot form,
html:has(.gate-backdrop) .position-strip .gate-slot button { pointer-events: auto; }
.position-strip {
position: absolute;
@@ -608,7 +614,7 @@ html:has(.role-select-backdrop) .position-strip .gate-slot { pointer-events: non
.role-select-backdrop {
position: fixed;
inset: 0;
z-index: 100;
z-index: 200;
display: flex;
justify-content: center;
align-items: center;