diff --git a/pitch-deck/app/pitch-print/print.css b/pitch-deck/app/pitch-print/print.css index 94a2d64..a303826 100644 --- a/pitch-deck/app/pitch-print/print.css +++ b/pitch-deck/app/pitch-print/print.css @@ -1,3 +1,9 @@ +/* Named page rule — must be outside @media print */ +@page slide-page { + size: A4 landscape; + margin: 0; +} + @media screen { body { background: #d1d5db; } } @@ -31,23 +37,30 @@ display: block !important; } - /* Block wrapper handles page breaks — flex containers break unreliably in Chrome */ - .print-page-break { + /* + * Block wrapper owns the page break. + * - `page: slide-page` assigns each wrapper its own named page type, + * which forces Firefox/Chrome to start a new physical page per element. + * - break-before/page-break-before are belt-and-suspenders for older engines. + * - We use break-before (not break-after) to avoid a blank trailing page. + */ + .print-page-break + .print-page-break { + page: slide-page; display: block !important; - page-break-after: always !important; - break-after: page !important; - page-break-inside: avoid !important; - break-inside: avoid !important; + break-before: page !important; + page-break-before: always !important; margin: 0 !important; padding: 0 !important; } - .print-page-break:last-child { - page-break-after: auto !important; - break-after: auto !important; + .print-page-break:first-child { + page: slide-page; + display: block !important; + margin: 0 !important; + padding: 0 !important; } - /* Flex container for internal layout only — no break properties here */ + /* Flex layout inside each slide — no break properties here */ .print-page { width: 297mm !important; height: 210mm !important;