aperture architecture: lift the page-locking foundation (html/body/.container overflow:hidden + flex-column + min-height:0; .row flex-shrink:0) from 5 per-page SCSS files into _base.scss — was opt-in per page via body.page-billboard / page-dashboard / page-gameboard / page-sky / page-wallet etc., with 5 near-identical html:has(body.page-X) { overflow: hidden } + body.page-X { … } blocks duplicating the same rules; any page that forgot to set page_class in its view context (e.g. epic.tarot_deck — never set) rendered without the aperture, letting applet borders + titles clip past the fixed navbar/footer sidebars at narrower viewports; foundation now universal, page-specific overrides stay scoped — gameboard keeps .container { overflow: clip } (Firefox seat-tooltip scroll-anchoring quirk) + billboard/dashboard/gameboard keep .row { margin-bottom: -1rem } (h2-row tightening); page_class context vars + body class hooks preserved (FTs at test_bud_btn.py:370 / :379 still assert on them); regression gate: 60 layout-sensitive FTs (billboard, my_buds, bud_btn, applet_my_posts, dashboard, wallet, gameboard, layout_and_styling, jasmine) + 43 room FTs (gatekeeper_bud_btn, room_gatekeeper, room_sky_select, sharing) all green

Code architected by Disco DeDisco <discodedisco@outlook.com>
Git commit message Co-Authored-By:
Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Disco DeDisco
2026-05-12 17:16:12 -04:00
parent 17c4518944
commit 3932b17256
6 changed files with 42 additions and 89 deletions

View File

@@ -24,6 +24,12 @@
}
// ── Shared aperture fill for both billboard pages ──────────────────────────
//
// Aperture foundation (html/body/.container overflow + flex-column +
// .row flex-shrink: 0) now lives universally in _base.scss. Only the
// page-specific `.row { margin-bottom: -1rem }` pull (tightening the
// h2 row against subsequent applet content) stays here, since wallet
// + sky pages deliberately don't carry that pull.
%billboard-page-base {
flex: 1;
@@ -33,31 +39,12 @@
position: relative;
}
html:has(body.page-billboard),
html:has(body.page-billscroll),
html:has(body.page-billpost),
html:has(body.page-billbuds),
html:has(body.page-billposts) {
overflow: hidden;
}
body.page-billboard,
body.page-billscroll,
body.page-billpost,
body.page-billbuds,
body.page-billposts {
overflow: hidden;
.container {
overflow: hidden;
display: flex;
flex-direction: column;
flex: 1;
min-height: 0;
}
.row {
flex-shrink: 0;
margin-bottom: -1rem;
}
}