fix(css): Fix CSS to print full page without border and background

Also resolves the problem with empty page before first page content on Firefox. Fixes: #542 Fixes: #543 Signed-off-by: Jonas <[email protected]>
nextcloud · Oct 27, 2023 · bb6ac3e · bb6ac3e
1 parent 21a4b18
commit bb6ac3e
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 6 deletions.
diff --git a/src/Collectives.vue b/src/Collectives.vue
@@ -162,6 +162,15 @@ export default {
 }
 
 @media print {
+	html, body {
+		background: var(--color-main-background, white) !important;
+	}
+
+	/* hide toast notifications for printing */
+	.toastify.dialogs {
+		display: none;
+	}
+
 	#header {
 		display: none !important;
 	}
@@ -170,12 +179,17 @@ export default {
 		display: block !important;
 	}
 
-	#text-wrapper #text div.ProseMirror {
-		margin-top: 0;
-		margin-bottom: 0;
-		padding-top: 0;
-		padding-bottom: 0;
+	#text-wrapper #text .content-wrapper {
+		display: block;
+
+		div.ProseMirror {
+			margin-top: 0;
+			margin-bottom: 0;
+			padding-top: 0;
+			padding-bottom: 0;
+		}
 	}
+
 }
 
 /* Align toggle with page list header bar */

diff --git a/src/components/Page/RichText.vue b/src/components/Page/RichText.vue
@@ -252,9 +252,9 @@ export default {
 
 <style lang="scss">
 @media print {
-
 	h1, h2, h3 {
 		page-break-after: avoid;
+		break-after: avoid;
 	}
 }
 </style>
diff --git a/src/components/PagePrint.vue b/src/components/PagePrint.vue
@@ -106,6 +106,7 @@ export default {
 
 	&-subpage {
 		page-break-before: always;
+		break-before: always;
 	}
 }
 
@@ -114,6 +115,7 @@ export default {
 }
 
 .editor__content {
+	display: block;
 	position: relative;
 }