component
TuxPageContainer
The content-width primitive. Three token-backed measures (
--layout-content-max/wide/prose-max) so every product shares the same page geometry instead of inventing max-widths per layout. basics
Default measure
Centered at --layout-content-max (80rem) with the standard 1.5rem gutter.
<!-- The page's main region at the standard measure (80rem). -->
<TuxPageContainer as="main">
<h1>Corpus inventory</h1>
…
</TuxPageContainer>variants
Wide · prose · flush
wide — 96rem
prose — 72ch
<TuxPageContainer width="wide"> <!-- 96rem — data grids -->
<TuxPageContainer width="prose"> <!-- 72ch — long-form reading -->
<TuxPageContainer flush> <!-- no gutter — full-bleed children -->chrome math
Sticky offsets without magic numbers
--tux-nav-height is published on <html> by TuxSiteNav and TuxAppFrame (ResizeObserver-measured), in both shell shapes.
/* Pair with the measured nav height TuxSiteNav/TuxAppFrame publish —
no more hardcoded 4rem/5rem offsets: */
.sidebar {
position: sticky;
top: calc(var(--tux-nav-height, 4rem) + 1rem);
}