Refine printed Markdown content rhythm

scripts/issue261EditorPdf.test.ts

@@ -46,3 +46,16 @@ test('floating toc toggle keeps a visible translucent surface outside edit mode'
 	assert.match(viewer, /\.toc-toggle-floating:focus-visible\s*\{[\s\S]*?outline:\s*2px solid var\(--color-accent-fg\);/);
 	assert.doesNotMatch(viewer, /\.toc-toggle-floating\.in-edit-mode:not\(\.expanded\)/);
 });
+
+test('print layout gives document content paper-specific rhythm and boundaries', () => {
+	const printStyles = styles.slice(styles.indexOf('@media print {'));
+
+	assert.match(printStyles, /\.markdown-body h1,[\s\S]*?line-height:\s*1\.2;/);
+	assert.match(printStyles, /\.markdown-body p\s*\{[\s\S]*?margin:\s*0 0 0\.75em;/);
+	assert.match(printStyles, /\.markdown-body ul,[\s\S]*?padding-left:\s*1\.5em;/);
+	assert.match(printStyles, /\.markdown-body blockquote\s*\{[\s\S]*?border-left:\s*3px solid #bbb;/);
+	assert.match(printStyles, /\.markdown-body pre\s*\{[\s\S]*?break-inside:\s*auto;/);
+	assert.match(printStyles, /\.markdown-body pre\s*\{[\s\S]*?border:\s*1px solid #d0d7de;/);
+	assert.match(printStyles, /\.markdown-body img\s*\{[\s\S]*?max-width:\s*100%\s*!important;/);
+	assert.match(printStyles, /\.markdown-body table\s*\{[\s\S]*?margin:\s*1em 0;/);
+});

src/styles.css

@@ -1501,6 +1501,69 @@ body {
 		break-inside: avoid;
 	}
 
+	/* Keep screen chrome out of the export while giving the document its own
+	   compact paper rhythm. These rules intentionally do not affect preview. */
+	.markdown-body h1,
+	.markdown-body h2,
+	.markdown-body h3,
+	.markdown-body h4,
+	.markdown-body h5,
+	.markdown-body h6 {
+		line-height: 1.2;
+		margin: 1.4em 0 0.55em;
+	}
+
+	.markdown-body p {
+		margin: 0 0 0.75em;
+	}
+
+	.markdown-body ul,
+	.markdown-body ol {
+		margin: 0.4em 0 0.8em;
+		padding-left: 1.5em;
+	}
+
+	.markdown-body li + li {
+		margin-top: 0.2em;
+	}
+
+	.markdown-body blockquote {
+		margin: 1em 0;
+		padding: 0.15em 1em;
+		color: #333;
+		border-left: 3px solid #bbb;
+	}
+
+	/* Code should retain a paper boundary but may split across pages rather
+	   than force a near-page-sized block onto the following page. */
+	.markdown-body pre {
+		margin: 1em 0;
+		padding: 0.75em 1em;
+		background: #f6f8fa;
+		border: 1px solid #d0d7de;
+		border-radius: 4px;
+		break-inside: auto;
+		page-break-inside: auto;
+	}
+
+	.markdown-body img {
+		display: block;
+		max-width: 100% !important;
+		height: auto !important;
+		margin: 1em auto;
+	}
+
+	.markdown-body table {
+		margin: 1em 0;
+		font-size: 0.9em;
+	}
+
+	.markdown-body table th,
+	.markdown-body table td {
+		padding: 0.4em 0.55em;
+		vertical-align: top;
+	}
+
 	.markdown-container {
 		zoom: 1 !important;
 	}