style d'impression

assets/css/panel.css

@@ -1,12 +1,12 @@
 .k-panel-menu {
-  background-color: var(--color-primary);
+  background-color: #000;
 }
 .k-panel-menu * {
-  color: var(--color-background);
+  color: #fff;
 }
 
 .k-panel-menu-button[aria-current] * {
-  color: var(--color-primary);
+  color: #000;
 }
 
 .k-panel[data-template="year"] .k-list-items .k-item:first-child {
@@ -20,6 +20,6 @@
   border-radius: var(--rounded-md) var(--rounded-md) 0 0;
   transform: translateY(0.3rem);
 
-  background-color: var(--color-primary);
+  background-color: #000;
-  color: var(--color-background);
+  color: #fff;
 }

assets/css/src/generic.css

@@ -138,5 +138,8 @@ button.less::after {
   width: 100%;
   margin-top: calc(var(--unit--vertical) / 2);
 }
+.only-print{
+  display: none;
+}
 
 

assets/css/src/print.css

@@ -1,8 +1,18 @@
 @media print {
   /* Hide header / footer infos. */
 
+  * {
+    -webkit-print-color-adjust: exact;
+    print-color-adjust: exact;
+  }
+
   @page {
-    margin: 0;
+    /*variable pas supporter dans les marges...*/
+    /*
+      --unit--horizontal: 2.5vw;
+      --unit--vertical: 1.7rem;
+    */
+    margin: 2.5vw 1.7rem;
     size: auto;
 
     @top-left {
@@ -25,38 +35,58 @@
       content: none;
     }
   }
+  .only-print{
+    display: block;
+  }
 
-  .panel, nav {
+  .panel, nav, .main-edito-btn, .theme-toggler, .page-cover .links,
-    display: none;
+  [data-template="home"] .title-wrapper button.open-nav, #nav-overlay{
+    display: none !important;
   }
 
   /* regle du light mode dupliqué*/
   :root {
-    --color-background: #ffffff;
+    --color-background: #ffffff !important;
-    --color-primary: #000;
+    --color-primary: #000 !important;
 
     --color-secondary-rgb: 140, 140, 140;
     --font-weight-light: 240;
+
+    --unit--vertical: 2cm;
   }
   body {
-    padding-top: 4rem;
     background-image: none;
     background-color: var(--color-background) !important;
   }
-
+  #main-header {
+    position: relative;
+    page-break-after: always;
+    padding-top: 0;
+  }
   .minimized #inactuel{
     transform: none !important;
     margin: 0 !important;
   }
+  #logo *{
+    font-size: 27.3vw;
+  }
   #logo h1{
     display: grid;
     grid-template-columns: 100%;
     grid-template-rows: auto;
   }
+  #logo span{
+    padding: 0;
+  }
   #logo #actuel, #logo #inactuel{
     grid-column: 1;
     grid-row: 1;
   }
+  [data-theme="light"] #logo #actuel, [data-theme="dark"] #logo #actuel,
+  [data-theme="light"] #logo #inactuel, [data-theme="dark"] #logo #inactuel{
+    mix-blend-mode: normal;
+  }
+
   #logo #actuel {
     font-weight: 550;
     color: rgb(254, 250, 254) !important;
@@ -66,16 +96,19 @@
   #logo #inactuel {
     z-index: 0;
   }
+  .page-cover{
+    padding-top: 0;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    height: auto;
+    page-break-after: always;
+  }
 
   .main-title.fs-xxl {
     font-size: 7rem !important;
     line-height: 1 !important;
   }
-
-  #main-header {
-    position: relative;
-  }
-
   #entry-btns {
     display: none;
   }
@@ -85,7 +118,17 @@
   }
 
   article #main-content {
-    width: 60%;
+    /* width: 60%; */
     margin: auto;
   }
+  main {
+    padding-left: 0;
+  }
+  /* .url{
+    position: absolute;
+    transform: rotate(90deg);
+    transform-origin: top left;
+    bottom: 0;
+    right: 0;
+  } */
 }

site/templates/linear.php

@@ -20,6 +20,10 @@
       / <a href="/categories/<?= Str::slug($page->category()) ?>"
         title="voir les textes de la catégorie <?= $page->category() ?>"><?= $page->category() ?></a>
     </p>
+    <p class="only-print">
+      <span class="light">imprimé le </span><span><?= \Kirby\Toolkit\Date::today()->format('d/m/Y'); ?></span><br>
+      <span class="light url"><?= $page->url() ?></span>
+    </p>
     <?php endslot() ?>
     <?php endsnippet() ?>