debut @print

web/themes/custom/eql/dist/assets/css/bundle.css

@@ -250,6 +250,171 @@ svg.ext {
     margin: auto;
   }
 }
+/* -----------------------/*
+ * Reset CSS Print "Bretzel"
+ * Made par Alsacréations
+ /* ---------------------- */
+/*
+ * Ressources et documentations :
+ * 1- https://www.docuseal.co/blog/css-print-page-style
+ * 2- https://www.alsacreations.com/astuce/lire/1160-Une-feuille-de-styles-de-base-pour-le-media-print.html
+*/
+@media print {
+  /* Dimension et marges de page */
+  @page {
+    size: A4 portrait;
+    margin: 1.5cm 1.5cm;
+  }
+  /* Reset général */
+  * {
+    all: unset;
+    display: revert;
+    box-sizing: border-box;
+  }
+  img {
+    max-width: 100%;
+  }
+  input,
+  textarea,
+  select {
+    all: revert;
+  }
+  /* On redéfinit les styles globaux (12pt = 16px) */
+  body {
+    width: auto;
+    margin: 0;
+    font-family: serif;
+    font-size: 12pt;
+    font-family: Georgia, serif;
+    line-height: 1.5;
+    color: #000000 !important;
+    background-color: #ffffff !important;
+  }
+  #fotter-bottom {
+    box-shadow: none !important;
+    border-top: rgba(0, 0, 0, 0.5);
+  }
+  #fotter-bottom a[href^=http]:after,
+  #fotter-bottom a[href^=https]:after {
+    content: "";
+  }
+  /* Espacements typographiques (15pt = 20px) */
+  p,
+  blockquote,
+  label,
+  ul,
+  ol {
+    margin-block: 0 15pt;
+  }
+  p:last-child {
+    margin-bottom: 0;
+  }
+  /* Titrages (24pt = 32px) */
+  h1 {
+    margin-block: 0 24pt;
+    font-weight: 700;
+    font-size: 18pt;
+    line-height: 1.1;
+  }
+  h2 {
+    margin-block: 0 18pt;
+    font-weight: 700;
+    font-size: 16pt;
+    line-height: 1.1;
+  }
+  h3 {
+    margin-block: 0 15pt;
+    font-weight: 700;
+    font-size: 14pt;
+  }
+  h4 {
+    margin-block: 0 12pt;
+    font-weight: 700;
+    font-size: 12pt;
+  }
+  /* Classes dédiées print / no-print */
+  .print {
+    display: revert;
+  }
+  .no-print {
+    display: none;
+  }
+  /* Pas de veuves ou orphelines (3 lignes minimum) */
+  p,
+  blockquote {
+    orphans: 3;
+    widows: 3;
+  }
+  /* Pas de saut de page au sein de ces éléments */
+  blockquote,
+  ul,
+  ol,
+  figure,
+  table,
+  .paragraph,
+  footer,
+  .top_top,
+  .top_bottom {
+    page-break-inside: avoid;
+  }
+  /* Pas de saut de page après ces éléments */
+  h1,
+  h2,
+  h3,
+  h4,
+  caption,
+  .field--name-field-titre {
+    page-break-after: avoid;
+  }
+  /* Styles des liens */
+  a,
+  a:link,
+  a:visited {
+    background: transparent !important;
+    color: unset;
+    font-weight: 700;
+    text-decoration: underline !important;
+  }
+  /* On affiche l'URL des liens externes */
+  a[href^=http]:after,
+  a[href^=https]:after {
+    content: " (" attr(href) ")";
+  }
+  /* On masque les vidéos, header et menu de navigation */
+  video,
+  object,
+  iframe,
+  header,
+  nav {
+    display: none !important;
+    width: 0 !important;
+    height: 0 !important;
+    overflow: hidden !important;
+  }
+  /*  Style page projet */
+  .page-node-type-projet .layout__region--top {
+    width: 100% !important;
+    padding-top: 0rem !important;
+  }
+  .page-node-type-projet .layout__region--top .top_top {
+    flex-direction: column !important;
+  }
+  .page-node-type-projet .layout__region--top .top_top .block-entity-fieldnodefield-photo {
+    width: 100% !important;
+  }
+  .page-node-type-projet .layout__region--top .top_top .top_right {
+    width: 100% !important;
+  }
+  .page-node-type-projet .layout__region--top .top_bottom {
+    width: 100% !important;
+  }
+  .page-node-type-projet .layout__region--first {
+    display: none;
+  }
+  .page-node-type-projet .layout__region--second {
+    flex: 0 1 100% !important;
+  }
+}
 /*pages*/
 /*
 @import "pages/partials/header_footer";

web/themes/custom/eql/scss/global/_print.scss

@@ -0,0 +1,186 @@
+
+
+/* -----------------------/*
+ * Reset CSS Print "Bretzel"
+ * Made par Alsacréations
+ /* ---------------------- */
+
+/*
+ * Ressources et documentations :
+ * 1- https://www.docuseal.co/blog/css-print-page-style
+ * 2- https://www.alsacreations.com/astuce/lire/1160-Une-feuille-de-styles-de-base-pour-le-media-print.html
+*/
+
+@media print {
+    /* Dimension et marges de page */
+    @page {
+      size: A4 portrait;
+      margin: 1.5cm 1.5cm;
+    }
+  
+    /* Reset général */
+    * {
+      all: unset;
+      display: revert;
+      box-sizing: border-box;
+    }
+    img {
+      max-width: 100%;
+    }
+    input,
+    textarea,
+    select {
+      all: revert;
+    }
+  
+    /* On redéfinit les styles globaux (12pt = 16px) */
+    body {
+
+      width: auto;
+      margin: 0;
+      font-family: serif;
+      font-size: 12pt;
+      font-family: Georgia, serif;
+      line-height: 1.5;
+      color: #000000 !important;
+      background-color: #ffffff !important;
+    }
+    #fotter-bottom{
+        box-shadow: none !important;
+        border-top: rgba($color: #000000, $alpha: 0.5);
+        a[href^="http"]:after,
+        a[href^="https"]:after {
+          content: "";
+        }
+    }
+  
+    /* Espacements typographiques (15pt = 20px) */
+    p,
+    blockquote,
+    label,
+    ul,
+    ol {
+      margin-block: 0 15pt;
+    }
+    p:last-child {
+      margin-bottom: 0;
+    }
+  
+    /* Titrages (24pt = 32px) */
+    h1 {
+      margin-block: 0 24pt;
+      font-weight: 700;
+      font-size: 18pt;
+      line-height: 1.1;
+    }
+    h2 {
+      margin-block: 0 18pt;
+      font-weight: 700;
+      font-size: 16pt;
+      line-height: 1.1;
+    }
+    h3 {
+      margin-block: 0 15pt;
+      font-weight: 700;
+      font-size: 14pt;
+    }
+    h4 {
+      margin-block: 0 12pt;
+      font-weight: 700;
+      font-size: 12pt;
+    }
+  
+    /* Classes dédiées print / no-print */
+    .print {
+      display: revert;
+    }
+    .no-print {
+      display: none;
+    }
+  
+    /* Pas de veuves ou orphelines (3 lignes minimum) */
+    p,
+    blockquote {
+      orphans: 3;
+      widows: 3;
+    }
+  
+    /* Pas de saut de page au sein de ces éléments */
+    blockquote,
+    ul,
+    ol,
+    figure,
+    table,
+    .paragraph,
+    footer,
+    .top_top,
+    .top_bottom {
+      page-break-inside: avoid;
+    }
+  
+    /* Pas de saut de page après ces éléments */
+    h1,
+    h2,
+    h3,
+    h4,
+    caption,
+    .field--name-field-titre {
+      page-break-after: avoid;
+    }
+  
+    /* Styles des liens */
+    a,
+    a:link,
+    a:visited {
+      background: transparent !important;
+      color: unset;
+      font-weight: 700;
+      text-decoration: underline !important;
+    }
+  
+    /* On affiche l'URL des liens externes */
+    a[href^="http"]:after,
+    a[href^="https"]:after {
+      content: " (" attr(href) ")";
+    }
+  
+    /* On masque les vidéos, header et menu de navigation */
+    video,
+    object,
+    iframe,
+    header,
+    nav {
+      display: none !important;
+      width: 0 !important;
+      height: 0 !important;
+      overflow: hidden !important;
+    }
+
+    /*  Style page projet */
+    .page-node-type-projet{
+        .layout__region--top{
+            width: 100% !important;
+            padding-top: 0rem !important;
+            .top_top{
+                flex-direction: column !important;
+                .block-entity-fieldnodefield-photo{
+                    width: 100% !important;
+                }
+                .top_right{
+                    width: 100% !important;
+                }
+            }
+            .top_bottom{
+                width: 100% !important;
+            }
+        }
+        .layout__region--first{
+            display: none;
+        }
+        .layout__region--second{
+            flex: 0 1 100% !important;
+        }
+    }
+
+  }
+  

web/themes/custom/eql/scss/pages/_projet.scss

@@ -51,6 +51,14 @@
                                         display: none;
                                     }
                                 }
+                                // .slick-prev::before, .slick-next::before{
+                                //         opacity: 1 !important;
+                                //         top: 0 !important;
+                                // }
+                                // .slick-prev, .slick-next{
+                                //     top: 98% !important;
+                                // }  
+                                
                 
                             }
 

web/themes/custom/eql/scss/styles.scss

@@ -14,7 +14,7 @@
 // @import "global/_reset";
 @import "global/_typography";
 @import "global/_mediaqueries";
-
+@import "global/_print";
 // @import "global/_nodetyperessource.scss";