display screen print

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

@@ -317,18 +317,34 @@ svg.ext {
   display: none;
 }
 .path-projets-complets .view-header {
-  position: fixed;
-  right: 0;
+  display: flex;
+  flex-direction: row;
+}
+.path-projets-complets .view-header::before {
+  content: "2. ";
   margin-right: 2rem;
+  margin-bottom: 1rem;
+  font-weight: 600;
+  font-size: 1.5rem;
+  min-width: fit-content;
+}
+@media (max-width: 479px) {
+  .path-projets-complets .view-header::before {
+    padding-bottom: 1rem;
+  }
+}
+.path-projets-complets .view-header {
+  margin-left: 3rem;
+  order: 2;
   margin-top: 5rem;
+}
+.path-projets-complets .view-header p {
   font-weight: 600;
   text-transform: uppercase;
   padding: 0.3rem 0.7rem;
   width: fit-content;
   background-color: rgb(0, 158, 227);
   border: none;
-}
-.path-projets-complets .view-header p {
   margin: 0;
 }
 .path-projets-complets .view-header a {
@@ -336,6 +352,8 @@ svg.ext {
 }
 .path-projets-complets .view-projets {
   margin-bottom: 4rem !important;
+  display: flex;
+  flex-direction: column;
 }
 .path-projets-complets .view-projets .buttons-filtres-ressources {
   display: none;
@@ -344,7 +362,9 @@ svg.ext {
   margin: auto;
 }
 .path-projets-complets .view-projets .view-filters {
+  order: 1;
   margin-top: 4rem;
+  margin-left: 3rem;
   padding-left: 0.5rem;
   display: flex;
   flex-direction: column;
@@ -357,11 +377,11 @@ svg.ext {
   }
 }
 .path-projets-complets .view-projets .view-filters::before {
-  content: "Sélectionner les projets à imprimer :";
+  content: "1. Sélectionner les projets à imprimer :";
   margin-right: 2rem;
   margin-bottom: 1rem;
-  margin-left: 0.5rem;
-  font-weight: 900;
+  font-weight: 600;
+  font-size: 1.5rem;
   min-width: fit-content;
 }
 @media (max-width: 479px) {
@@ -369,6 +389,9 @@ svg.ext {
     padding-bottom: 1rem;
   }
 }
+.path-projets-complets .view-projets .view-content {
+  order: 3;
+}
 .path-projets-complets .view-projets .field--name-title {
   order: 2;
   font-family: "Marianne";

web/themes/custom/eql/scss/global/print/_projets-complets-ecran.scss

@@ -22,30 +22,53 @@
 
     ///// bouton print //////
     .view-header{
-  
-      position: fixed;
-      right: 0;
-      margin-right: 2rem;
+      display: flex;
+      flex-direction: row;
+      // position: fixed;
+      // right: 0;
+      &::before{
+        content: '2. ';
+        margin-right: 2rem;
+        // margin-bottom: 1rem;
+        // margin-left: 0.5rem;
+        font-weight: 600;
+        font-size: 1.5rem;
+        // width: 160px;
+        min-width: fit-content;
+        @media (max-width: 479px){
+            padding-bottom: 1rem;
+        }
+    }
+      margin-left: 3rem;
+      order: 2;
       margin-top: 5rem;
-      font-weight: 600;
-      text-transform: uppercase;
-      padding: 0.3rem 0.7rem;
-      width: fit-content;
-      background-color: $blue-light; 
-      border: none;
-      p{margin: 0;}
+
+      p{
+        font-weight: 600;
+        text-transform: uppercase;
+        padding: 0.3rem 0.7rem;
+        width: fit-content;
+        background-color: $blue-light; 
+        border: none;
+        margin: 0;}
       a{color: white;}
+      
+
     }
 
 
     .view-projets{
       margin-bottom: 4rem !important;
+      display: flex;
+      flex-direction: column;
     ///// filtres ///////////
       .buttons-filtres-ressources{display: none;}
      
       margin: auto;
       .view-filters{
+        order: 1;
         margin-top: 4rem;
+        margin-left: 3rem;
         padding-left: 0.5rem;
         display: flex;
         flex-direction: column;
@@ -56,11 +79,12 @@
         }
       
         &::before{
-            content: 'Sélectionner les projets à imprimer :';
+            content: '1. Sélectionner les projets à imprimer :';
             margin-right: 2rem;
             margin-bottom: 1rem;
-            margin-left: 0.5rem;
-            font-weight: 900;
+            // margin-left: 0.5rem;
+            font-weight: 600;
+            font-size: 1.5rem;
             // width: 160px;
             min-width: fit-content;
             @media (max-width: 479px){
@@ -70,6 +94,10 @@
                     
       }
 
+      .view-content{
+        order: 3;
+      }
+
       .field--name-title {
         order: 2;
         font-family: "Marianne";