fix: Improve print version in dark mode (#442)

Resolves #365

Co-authored-by: Robert Schuster <robert.r.schuster@deutschebahn.com>

Author: MoritzWeber0

assets/sass/_variables.scss

@@ -40,25 +40,31 @@ html {
   --border: 0.1rem solid transparent;
   --pagefind-ui-font: roboto, Arial, Helvetica, sans-serif;
   --outline-focus-indicator: #257fa8;
+
+  @media print {
+    --bg-neutral: white;
+  }
 }
 
 html[data-theme="dark"] {
-  --pagefind-ui-text: #fff;
-  --link-default: #ff6b3d;
-  --link-hovered: #ff8a5b;
-  --link-special: #ffffff;
-  --bg-default: #151b23;
-  --bg-neutral: #0d1117;
-  --color-onLight: #ffffff;
-  --color-table-border: #555;
-  --color-body: #e0e0e0;
-  --pagefind-ui-border: #555;
-  --box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.5);
-  --box-shadow-light: 0.4rem 0.4rem 0.4rem rgba(0, 0, 0, 0.3);
-  --pagefind-ui-background: var(--bg-default);
-  --highlight-color-tip: #1a4a5c;
-  --highlight-color-inofficial: #2a2d30;
-  --highlight-color-important: #4a2a1a;
-  --border: 0.1rem solid #3d444d;
-  --outline-focus-indicator: #2e9acb;
+  @media screen {
+    --pagefind-ui-text: #fff;
+    --link-default: #ff6b3d;
+    --link-hovered: #ff8a5b;
+    --link-special: #ffffff;
+    --bg-default: #151b23;
+    --bg-neutral: #0d1117;
+    --color-onLight: #ffffff;
+    --color-table-border: #555;
+    --color-body: #e0e0e0;
+    --pagefind-ui-border: #555;
+    --box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.5);
+    --box-shadow-light: 0.4rem 0.4rem 0.4rem rgba(0, 0, 0, 0.3);
+    --pagefind-ui-background: var(--bg-default);
+    --highlight-color-tip: #1a4a5c;
+    --highlight-color-inofficial: #2a2d30;
+    --highlight-color-important: #4a2a1a;
+    --border: 0.1rem solid #3d444d;
+    --outline-focus-indicator: #2e9acb;
+  }
 }

assets/sass/button.scss

@@ -20,4 +20,9 @@
   }
 
   @include focus-indicator(0.2rem);
+
+  @media print {
+    padding: 0.6rem;
+    display: block;
+  }
 }

assets/sass/expander.scss

@@ -11,6 +11,10 @@
   justify-content: space-between;
   border-radius: var(--border-radius-m);
 
+  @media print {
+    padding: 0.6rem;
+  }
+
   &:not(.o-expander__summary--booking) {
     font-weight: 700;
   }
@@ -46,6 +50,10 @@
 .o-expander__content {
   padding: 1.2rem;
 
+  @media print {
+    padding: 0.6rem;
+  }
+
   // Remove margins from last elements of expander (up to 3 levels deep)
   & > *:last-child,
   & > *:last-child > *:last-child,

assets/sass/styles.scss

@@ -14,6 +14,7 @@ body {
 
   @media print {
     print-color-adjust: exact;
+    color: black;
     font-size: 1.4em;
   }
 }

assets/sass/textHighlight.scss

@@ -13,6 +13,7 @@
 
   @media print {
     page-break-inside: avoid;
+    padding: 0.6rem;
   }
 }