From 42cbdcd92354ca7fa24cc00c0c54ae9fd837f81b Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Thu, 10 Mar 2022 11:54:15 +0000
Subject: [PATCH] Add css print styles to ensure multi-page print is possible

---
 packages/client/src/components/ClientApp.svelte  |  8 ++++++++
 packages/client/src/components/app/Layout.svelte | 16 ++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/packages/client/src/components/ClientApp.svelte b/packages/client/src/components/ClientApp.svelte
index e8ed7e9538..9a14f72ec8 100644
--- a/packages/client/src/components/ClientApp.svelte
+++ b/packages/client/src/components/ClientApp.svelte
@@ -226,4 +226,12 @@
     border: 1px solid var(--spectrum-global-color-gray-300);
     border-radius: 4px;
   }
+
+  @media print {
+    #spectrum-root,
+    #clip-root,
+    #app-root {
+      overflow: visible !important;
+    }
+  }
 </style>
diff --git a/packages/client/src/components/app/Layout.svelte b/packages/client/src/components/app/Layout.svelte
index 600d295cba..a801ea4b46 100644
--- a/packages/client/src/components/app/Layout.svelte
+++ b/packages/client/src/components/app/Layout.svelte
@@ -427,4 +427,20 @@
     height: var(--height);
     z-index: 998;
   }
+
+  /* Print styles */
+  @media print {
+    .layout,
+    .main-wrapper {
+      overflow: visible !important;
+    }
+    .nav-wrapper {
+      display: none !important;
+    }
+    .layout {
+      flex-direction: column !important;
+      justify-content: flex-start !important;
+      align-items: stretch !important;
+    }
+  }
 </style>