From 7e119b7721fed09fe9cd3550d7c6a1850a8a3539 Mon Sep 17 00:00:00 2001
From: s-ol <s-ol@users.noreply.github.com>
Date: Sun, 29 Dec 2019 15:30:11 +0100
Subject: print CSS

---
 scss/_browser.scss |  2 +-
 scss/_print.scss   | 31 +++++++++++++++++++++++++++++++
 scss/_reset.scss   |  2 +-
 scss/main.scss     |  1 +
 4 files changed, 34 insertions(+), 2 deletions(-)
 create mode 100644 scss/_print.scss

diff --git a/scss/_browser.scss b/scss/_browser.scss
index 118842f..48af7d4 100644
--- a/scss/_browser.scss
+++ b/scss/_browser.scss
@@ -130,7 +130,7 @@
     margin: 0 1em;
     align-self: flex-start;
     min-width: 30vw;
-    background: var(--white);
+    background: $white;
 
     position: relative;
   }
diff --git a/scss/_print.scss b/scss/_print.scss
new file mode 100644
index 0000000..36f2a96
--- /dev/null
+++ b/scss/_print.scss
@@ -0,0 +1,31 @@
+@media print {
+  h1, h2, h3 {
+    break-after: avoid-page;
+  }
+
+  .view {
+    flex: 1 0 auto;
+
+    .content {
+      flex: 1 0 auto;
+    }
+  }
+
+  body {
+    background: $white;
+  }
+}
+
+@page {
+  size: a4;
+  margin: 2.5cm 0 2.5cm;
+}
+
+@page :first {
+  margin-top: 0;
+}
+
+@page :last {
+  margin-bottom: 0;
+}
+
diff --git a/scss/_reset.scss b/scss/_reset.scss
index 724624d..ea77593 100644
--- a/scss/_reset.scss
+++ b/scss/_reset.scss
@@ -43,7 +43,7 @@ body {
   flex-direction: column;
   justify-content: space-between;
 
-  background: var(--gray-bright);
+  background: $gray-bright;
   font-family: sans-serif;
 
   min-height: 100vh;
diff --git a/scss/main.scss b/scss/main.scss
index efec299..9b6e6ce 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -8,3 +8,4 @@
 @import 'content';
 @import 'sidenotes';
 @import 'canvasapp';
+@import 'print';
-- 
cgit v1.2.3