diff --git a/README.md b/README.md index 629fa45..cacec68 100644 --- a/README.md +++ b/README.md @@ -91,6 +91,19 @@ Der aktuelle Slide (und ggf. Fragment-Fortschritt) wird im URL-Hash gespiegelt (z. B. `#3` oder `#3.2` für Slide 3, zweites Fragment sichtbar) und beim Laden daraus wiederhergestellt. +## PDF-Export + +Über den Druckdialog des Browsers (`Cmd/Ctrl+P` → „Als PDF sichern“) lässt +sich die Präsentation direkt als PDF exportieren — jede Slide wird dabei auf +eine eigene Seite gedruckt, Navigationselemente werden ausgeblendet. Das +funktioniert sowohl im Dev-Server als auch mit dem statischen `-build`-Export. + +In Chrome funktioniert das fehlerfrei inklusive automatischem Querformat. +Safari ignoriert die CSS-Vorgabe für die Seitenausrichtung (bekannte +WebKit-Einschränkung) und erzeugt dadurch teils Leerseiten — hier im +Druckdialog manuell „Querformat“ wählen, oder für den PDF-Export auf Chrome +ausweichen. + ## Fragments (Bullet-Points einzeln einblenden) Setzt eine Slide-Datei `incremental: true` im Frontmatter, werden ihre diff --git a/web/assets/vendor/style.css b/web/assets/vendor/style.css index ded66f5..9c5a1b0 100644 --- a/web/assets/vendor/style.css +++ b/web/assets/vendor/style.css @@ -310,3 +310,36 @@ body.grid-mode section.slide > * { body.grid-mode .fragment { opacity: 1; } + +@page { + size: landscape; + margin: 0; +} + +@media print { + .nav-zone, + .nav-button, + .progress { + display: none !important; + } + + section.slide { + position: static; + opacity: 1; + visibility: visible; + width: 100%; + height: 100vh; + overflow: hidden; + break-after: page; + page-break-after: always; + } + + section.slide:last-of-type { + break-after: auto; + page-break-after: auto; + } + + .fragment { + opacity: 1; + } +}