Voorbeeldpagina

Deze pagina demonstreert elk ondersteund patroon: secties, kaarten, knoppen, lijsten, call-to-actions en de EJS-include-flow.

Primaire actie Secundair

Bootstrap grid

1
1
1
1
1
1
1
1
1
1
1
1
2
2
2
2
2
2
3
3
3
3
4
4
4
6
6
12

Kenmerkenraster

Kaart één

Gebruik deze lay-out voor elk raster van 2 tot 4 items (features, prijsplannen, testimonials).

Kaart twee

Kaarten reken zich automatisch op tot gelijke hoogte via de standaard grid-waarden.

Kaart drie

Thema via designtokens in packages/style/src/_variables.scss.

Kaart vier

Voeg gerust een vierde of vijfde kaart toe - het raster wikkelt vanzelf.

Alternatieve sectie

Gebruik .bg-body-tertiary voor een subtiele grijze achtergrond, of .bg-dark .text-white voor een donker omgekeerd paneel. Beide komen uit Bootstrap via @repo/style.

  • Voeg bg-body-tertiary of bg-dark toe voor visuele afwisseling.
  • De ruimte zit er al in: py-5 voegt verticale padding toe.
  • Gebruik .container binnenin om de breedte te beperken.
Terug naar home