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 $pos-d-y: round($pos-d * 0.866); // 95px
// ─── Position strip ──────────────────────────────────────────────────────── // ─── Position strip ────────────────────────────────────────────────────────
// Numbered gate-slot circles rendered above the backdrop (z 130 > overlay 120 // Numbered gate-slot circles sit above the gate backdrop/overlay (z 130 > 120
// > backdrop 100). .room-page is position:relative with no z-index, so its // > 100) but below the role-select fan (z 200), tray (310), and menus (310+).
// absolute children share the root stacking context with the fixed overlays. // .room-page is position:relative with no z-index, so its absolute children
// When role-select is open, suppress pointer events so the strip doesn't // share the root stacking context with the fixed overlays.
// intercept clicks on cards (landscape: strip overlaps centered card fan). // 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 // Must target .gate-slot directly — it has an explicit pointer-events: auto
// override that wins over a rule on the parent .position-strip alone. // 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; } 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-strip {
position: absolute; position: absolute;
@@ -608,7 +614,7 @@ html:has(.role-select-backdrop) .position-strip .gate-slot { pointer-events: non
.role-select-backdrop { .role-select-backdrop {
position: fixed; position: fixed;
inset: 0; inset: 0;
z-index: 100; z-index: 200;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;