CSS: page-layout

div[class~="instui-page-layout"] — Standard trekolonne sideoppsett med topptekst, sidefelt og hovudinnhald.

✅ Bruk Page-Layout når:

• Du treng ein klassisk sidestruktur med navigasjon og innhaldsområde

• Sida har eit tydeleg hovudinnhald flankert av komplementære område

• Du ønskjer jamn avstand og justering gjennom oppsettet 🚫 Bruk ikkje Page-Layout når:

• Byggjer ei einkolonne-side — bruk eit enklare oppsett i staden

• Sidefeltet konkurrerer med hovudinnhaldet om merksemd

Tilgjenge

• Kartlegg hovudinnhaldsområdet til eit <main>-landemerke
• Gje sidefeltet role="navigation" eller role="complementary" etter behov
• Sørg for at landemerkeområda har distinkte aria-labels

Bruk

@import "@pantoken/plugin-layouts/layouts.css";

Delar

Del	Skildring
.instui-body	Hovuddel som inneheld sidefeltet og innhaldet.
.instui-footer	Botnfotområde.
.instui-header	Topptekstområde.
.instui-main	Sentralt innhaldsområde.
.instui-sidebar	Venstre navigasjons- eller hjelpekolonne.

Tilstandar

Tilstand	Skildring
:optional	—

Token brukt

Token	Type	Verdi
--instui-color-border	—	—
--instui-color-footer-background	—	—
--instui-color-footer-text	—	—
--instui-color-header-background	—	—
--instui-color-sidebar-background	—	—
--instui-font-size-small	<length>	—
--instui-space-medium	—	—

Relatert

• wrapper