fix(adminui): modal backdrop offset came from .rise's retained transform, not 100vw (#631)

Live-measured on docker-dev: the backdrop was viewport-wide (1911px) but started at the
panel's left edge (241px) because the theme's .rise animation (fill-mode both) leaves an
identity transform on section.panel, re-basing position:fixed descendants. Override the
fill mode to backwards; drops the speculative backdrop/dialog sizing overrides.

Claude-Session: https://claude.ai/code/session_01Ef2ozxS7QPanGT8uoATbTe
This commit is contained in:
Joseph Doherty
2026-10-08 14:22:32 -04:00
parent c9fdcc3ea6
commit da203d5d7e
@@ -49,21 +49,13 @@
width: 18px; width: 18px;
} }
/* Modal sizing (#631). Bootstrap sizes .modal-backdrop with 100vw/100vh, and 100vw includes the /* Modal backdrop overran the viewport on /raw (#631). The theme's `.rise` entrance animation runs with
scrollbar gutter, so on a tall form (Configure driver / Modbus) the backdrop overran the viewport `animation-fill-mode: both`, which keeps its final keyframe's transform applied for good — and ANY
and produced a page-level horizontal scrollbar. Pin it with inset:0 instead (no vw/vh), and keep transform (even the identity it leaves) makes that section the containing block for position:fixed
the dialog inside the viewport. These modals are hand-rolled (display:block, no Bootstrap JS). */ descendants. A modal rendered inside a `.panel.rise` therefore had its fixed backdrop offset by the
.modal-backdrop { panel's left edge, so it ran 240px past the viewport and the page grew a horizontal scrollbar.
inset: 0; `backwards` keeps the hidden start state during the stagger delay but drops the transform once the
width: auto; animation ends. (Upstream fix belongs in ZB.MOM.WW.Theme's theme.css.) */
height: auto; .rise {
} animation-fill-mode: backwards;
.modal {
overflow-x: hidden;
overflow-y: auto;
}
.modal-dialog {
max-width: min(var(--bs-modal-width, 500px), calc(100vw - 2rem));
} }