Skip to content

feat(PageLayout, PageBody): structurele full-page layout container#166

Merged
jeffreylauwers merged 3 commits intomainfrom
feature/page-layout
Apr 17, 2026
Merged

feat(PageLayout, PageBody): structurele full-page layout container#166
jeffreylauwers merged 3 commits intomainfrom
feature/page-layout

Conversation

@jeffreylauwers
Copy link
Copy Markdown
Owner

Sluit #163.

Summary

  • PageLayout: flex-column <div> met min-block-size: 100dvh — de buitenste wrapper voor elke pagina
  • PageBody: flex: 1 <div> — vult beschikbare verticale ruimte zodat PageFooter altijd onderaan de viewport staat

Beide componenten zijn CSS-only structuurlagen zonder design tokens. PageLayout heeft Storybook documentatie (.stories.tsx, .docs.mdx, .docs.md) met een Default story die SkipLink + PageHeader + PageBody + PageFooter combineert.

Test plan

  • 1354 tests groen (pnpm test)
  • TypeScript schoon (pnpm --filter storybook exec tsc --noEmit)
  • Lint schoon (pnpm lint)
  • Export toegevoegd aan packages/components-react/src/index.ts
  • Introduction.mdx bijgewerkt (datum + componentnamen in de lijst)

🤖 Generated with Claude Code

jeffreylauwers and others added 3 commits April 17, 2026 17:17
Sluit issue #163. Voegt twee nieuwe componenten toe:

- `PageLayout`: flex-column wrapper met `min-block-size: 100dvh` voor
  full-page sticky-footer patroon
- `PageBody`: `flex: 1` wrapper die de beschikbare verticale ruimte
  opvult zodat `PageFooter` altijd onderaan de viewport staat

Beide componenten hebben HTML/CSS en React implementaties, tests,
en Storybook documentatie (PageLayout).

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…ewport header

Zonder primaryNavigation toonde PageHeader op large viewport alleen het
logo zonder navbar. Story nu met horizontale Menu voor het complete beeld.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…default stories

Story gebruikt nu dezelfde navigatie (Level 1a-1d, English/Mijn omgeving,
zoekveld) en footer-slots (slot1-4) als de default stories van PageHeader
en PageFooter.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@jeffreylauwers jeffreylauwers merged commit 45ba9d3 into main Apr 17, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant