From 0d47ff65f9b431adfda3eb00dbbf819e16f1824c Mon Sep 17 00:00:00 2001
From: Christopher Tempel <christopher.tempel@tyclipso.net>
Date: Mon, 11 Aug 2025 10:46:54 +0200
Subject: [PATCH] Enhance print styles to keep headings with following content

- Prevent h1/h2 from being isolated at page end using break-after/page-break-after
- Avoid page breaks before content directly following h1/h2
- Keep large elements (images, figures, screenshots) directly after headings together on same page
- Added legacy `page-break-*` rules for better browser compatibility
---
 client/themes/tyclipso/scss/_print.scss | 31 ++++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/client/themes/tyclipso/scss/_print.scss b/client/themes/tyclipso/scss/_print.scss
index 4ca0c5e6..4516df93 100644
--- a/client/themes/tyclipso/scss/_print.scss
+++ b/client/themes/tyclipso/scss/_print.scss
@@ -14,7 +14,10 @@
   }
 
   .v-application .is-page-header.is-page-header  {
-    .headline, .headline.grey--text.text--lighten-2, .caption, .caption.grey--text.text--darken-1 {
+    .headline,
+    .headline.grey--text.text--lighten-2,
+    .caption,
+    .caption.grey--text.text--darken-1 {
       color: #1a1a1a !important;
     }
   }
@@ -24,8 +27,10 @@
       color: black !important;
     }
 
+    /* Kapitelbeginn auf neuer Seite */
     h1:not(:first-child) {
       break-before: page !important;
+      page-break-before: always !important; /* legacy */
     }
 
     h1 {
@@ -36,9 +41,31 @@
       font-size: 1.2rem !important;
     }
 
+    /* Überschriften nicht am Seitenende hängen lassen */
     h1, h2, h3 {
       break-after: avoid-page !important;
     }
+    h1, h2 {
+      page-break-after: avoid !important; /* legacy/webkit */
+    }
+
+    /* Folgenden Block nicht vom Heading trennen */
+    h1 + *,
+    h2 + * {
+      break-before: avoid !important;
+      page-break-before: avoid !important; /* legacy/webkit */
+    }
+
+    /* Große direkt folgende Elemente als Einheit behandeln */
+    h1 + img,
+    h2 + img,
+    h1 + figure,
+    h2 + figure,
+    h1 + .screenshot,
+    h2 + .screenshot {
+      break-inside: avoid !important;
+      page-break-inside: avoid !important; /* legacy/webkit */
+    }
 
     @at-root .v-main.v-main & h1 + h2 {
       margin-top: 0.5em !important;
@@ -51,10 +78,12 @@
 
     ul, ol {
       break-before: avoid-page !important;
+      page-break-before: avoid !important; /* legacy */
     }
 
     blockquote {
       break-inside: avoid-page !important;
+      page-break-inside: avoid !important; /* legacy */
       border-color: #dddddd !important;
       background-color: #f0f0f0 !important;