,
etc.).
- Voeg indien nodig een id attribuut toe voor navigatie.
- Zorg dat alle interactieve elementen binnen de container toegankelijk zijn.
- Gebruik logische heading niveaus binnen de container.Varianten
$3
De standaard page-container component met consistente maximale breedte en
centrering.
`js
export const Default = {
args: {
content: Pagina titel
Dit is de inhoud van de pagina met consistente styling en spacing.
,
id: "page-container-1",
},
};
`Styling
De styling wordt verzorgd door de page-container CSS:
-
.dictu-page-container` — basis container styling met maximale breedte,centrering en padding
Functies
- Maximale breedte: Gecontroleerde maximale breedte via design tokens
- Centrering: Automatische centrering van content
- Padding: Horizontale padding voor consistente uitlijning
- Reset margins: Alle margins worden gereset voor predictable styling
- Responsief: Flexibele breedte die zich aanpast aan het scherm
Licentie
EUPL-1.2