feat(export): keuze-menu als kaartenraster in de HTML-export (#1162) #1196

Merged
brenno merged 3 commits from feat/1162-menu-html-export into main 2026-08-04 08:03:45 +00:00
Owner

Wat

De HTML-export tekent een keuze-menudia (SlideType.menu, #1162) nu als hetzelfde kaartenraster als de app-preview, de presentator en de PDF-export. Voorheen kwam een menudia er als een platte lijst hyperlinks uit — de rasterlook ging verloren.

Vondst tijdens de visuele keuring

Bij het renderen van de huidige uitvoer (via de in-app browser; de headless build hing) bleek niet alleen het raster te ontbreken, maar landden de #anker-fragmentlinks nergens: marked v18 genereert geen kop-id's en de export gaf de <section>s geen id. De links wérkten dus feitelijk niet.

Wijziging

  • renderMenuSlide (nieuw, lib/services/marp_html/marp_html_service_menu.dart) — vervangt de link-bullets door een grid van kaarten. Doel-blok = <a> naar zijn #anker met accentrand; tekstblok = rustige <div> met een randkleur uit de tekstkleur; blokafbeelding als thumbnail. Kleuren komen inline uit het ThemeProfile (dezelfde alfa-waarden als _MenuBlockCard in de preview: rand 0.55/0.22, vulling 0.10/0.04), layout in _menuCss. Labels worden HTML-geëscaped; anker- en beeldpad gaan door _htmlAttr, DOMPurify is de tweede laag.
  • Sectie-id uit het anker (marp_html_service_markup.dart) — elke <section> krijgt nu een id uit ocideck_slide_anchor, zodat de menu-links (én elke handmatige [x](#anker)) landen.

Verificatie

  • Visueel bevestigd in de in-app browser: raster rendert met accentranden, afbeeldingskaart en tekstkaart; geen console-fouten; klik op een blok scrolt naar de doeldia.
  • Nieuwe test test/marp_html_menu_test.dart (7 gevallen): raster + kolomaantal, anker-link met accentrand, tekstblok zonder href, thumbnail, sectie-id, grid-CSS in de stylesheet, en HTML-escaping van het label.
  • make check groen (exit 0).

Stapelt bovenop de reeds gemergede menu-fase (#1192).

🤖 Generated with Claude Code

## Wat De **HTML-export** tekent een keuze-menudia (`SlideType.menu`, #1162) nu als hetzelfde kaartenraster als de app-preview, de presentator en de PDF-export. Voorheen kwam een menudia er als een platte lijst hyperlinks uit — de rasterlook ging verloren. ## Vondst tijdens de visuele keuring Bij het renderen van de huidige uitvoer (via de in-app browser; de headless build hing) bleek niet alleen het raster te ontbreken, maar landden de `#anker`-fragmentlinks **nergens**: marked v18 genereert geen kop-id's en de export gaf de `<section>`s geen `id`. De links wérkten dus feitelijk niet. ## Wijziging - **`renderMenuSlide`** (nieuw, `lib/services/marp_html/marp_html_service_menu.dart`) — vervangt de link-bullets door een grid van kaarten. Doel-blok = `<a>` naar zijn `#anker` met accentrand; tekstblok = rustige `<div>` met een randkleur uit de tekstkleur; blokafbeelding als thumbnail. Kleuren komen inline uit het `ThemeProfile` (dezelfde alfa-waarden als `_MenuBlockCard` in de preview: rand 0.55/0.22, vulling 0.10/0.04), layout in `_menuCss`. Labels worden HTML-geëscaped; anker- en beeldpad gaan door `_htmlAttr`, DOMPurify is de tweede laag. - **Sectie-`id` uit het anker** (`marp_html_service_markup.dart`) — elke `<section>` krijgt nu een `id` uit `ocideck_slide_anchor`, zodat de menu-links (én elke handmatige `[x](#anker)`) landen. ## Verificatie - Visueel bevestigd in de in-app browser: raster rendert met accentranden, afbeeldingskaart en tekstkaart; geen console-fouten; klik op een blok scrolt naar de doeldia. - Nieuwe test `test/marp_html_menu_test.dart` (7 gevallen): raster + kolomaantal, anker-link met accentrand, tekstblok zonder href, thumbnail, sectie-`id`, grid-CSS in de stylesheet, en HTML-escaping van het label. - `make check` groen (exit 0). Stapelt bovenop de reeds gemergede menu-fase (#1192). 🤖 Generated with [Claude Code](https://claude.com/claude-code)
De HTML-export gaf een menudia als een platte lijst hyperlinks; nu tekent
`renderMenuSlide` hetzelfde kaartenraster als de app, presentator en PDF —
doel-blok als `<a>` naar zijn `#anker` met accentrand, tekstblok als rustige
`<div>`, blokafbeelding als thumbnail. Kleuren komen inline uit het
ThemeProfile (dezelfde alfa's als de preview), de layout uit `_menuCss`.

Zodat de fragment-links ook landen, krijgt elke `<section>` nu een `id` uit
zijn `ocideck_slide_anchor`: marked v18 genereert zelf geen kop-id's, dus
zonder dit scrolde een `#anker`-link nergens heen — óók een handmatige
verwijzing profiteert.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Raster met kolomaantal, doel-blok als anker-link met accentrand, tekstblok
zonder href, afbeelding als thumbnail, sectie-`id` uit het anker, de grid-CSS
in de basisstylesheet, en een label dat HTML-geëscaped wordt i.p.v. als markup
te lekken.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
docs: keuze-menu in de HTML-export (changelog, gebruikersgids, bronkaart)
All checks were successful
scans / scans (pull_request) Successful in 3m18s
static-gate / static-gate (pull_request) Successful in 6m38s
699a2817cd
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
brenno merged commit fab9df31c7 into main 2026-08-04 08:03:45 +00:00
Sign in to join this conversation.
No description provided.