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:
@@ -7,6 +7,13 @@
|
||||
// 2.4vmin hits 16px (browser default) at vmin=667 (iPhone SE landscape).
|
||||
html {
|
||||
font-size: clamp(14px, 2.4vmin, 22px);
|
||||
// Aperture foundation — locks the document viewport so content lives
|
||||
// between/behind the fixed navbar + footer sidebars instead of leaking
|
||||
// into a page-level scroll. Was opt-in per-page via body.page-X classes
|
||||
// (duplicated 5× across SCSS files); now universal. Pages that need a
|
||||
// narrower override (e.g. body.page-gameboard .container { overflow:
|
||||
// clip; }) live in their per-page SCSS.
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// Layout custom properties — single source of truth for the landscape
|
||||
@@ -25,6 +32,7 @@ body {
|
||||
color: rgba(var(--secUser), 1);
|
||||
font-family: Georgia, serif;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
@@ -43,6 +51,14 @@ body {
|
||||
margin: 0 auto;
|
||||
// padding: 0 1rem;
|
||||
flex: 1;
|
||||
// Aperture container — flex-column so navbar + h2 row + page content
|
||||
// stack vertically, min-height: 0 + overflow: hidden contain the
|
||||
// content within the aperture so applet borders / titles can't
|
||||
// leak past the navbar / footer sidebars at narrow viewports.
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
|
||||
.navbar {
|
||||
padding: 0.75rem 0;
|
||||
@@ -183,6 +199,10 @@ body {
|
||||
|
||||
.row {
|
||||
padding: 2rem 0;
|
||||
// Aperture: the h2-row mustn't shrink when the page-content
|
||||
// child fills the remaining vertical space. Universal — was
|
||||
// duplicated in every body.page-X { .row { flex-shrink: 0 } }.
|
||||
flex-shrink: 0;
|
||||
|
||||
.col-md-12 {
|
||||
width: 100%;
|
||||
|
||||
Reference in New Issue
Block a user