Skip to content

Commit 46e1a99

Browse files
committed
Add a print-specific style sheet
It would appear that the navigation bar is already suppressed when printing, thanks to being inside an `<aside>` element. Other elements that are not useful in print, such as the search box, the version selector, the dark mode toggle, and the "Edit this page" link are now also hidden when printing. Signed-off-by: Johannes Schindelin <johannes.schindelin@gmx.de>
1 parent 516db90 commit 46e1a99

File tree

2 files changed

+29
-0
lines changed

2 files changed

+29
-0
lines changed

assets/sass/application.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ $baseurl: "{{ .Site.BaseURL }}{{ if (and (ne .Site.BaseURL "/") (ne .Site.BaseUR
3030
@import 'cheat-sheet';
3131
@import 'dark-mode';
3232
@import 'git-turns-20';
33+
@import 'print';
3334

3435
code {
3536
display: inline;

assets/sass/print.scss

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
@media print {
2+
.inner {
3+
// The `position` of the `inner` class is defined as `relative`, which
4+
// causes funny issues when printing, for example tens of empty pages in
5+
// the middle. Let's suppress that.
6+
position: inherit;
7+
8+
width: inherit;
9+
margin-bottom: 0;
10+
}
11+
12+
#main {
13+
margin-bottom: 0;
14+
}
15+
16+
footer {
17+
padding: 0;
18+
margin-top: 0;
19+
}
20+
21+
aside, .sidebar-btn, #search-container, #reference-version, #dark-mode-button, .site-source {
22+
display: none;
23+
}
24+
25+
section {
26+
break-inside: avoid-page;
27+
}
28+
}

0 commit comments

Comments
 (0)