From 99d05401b8e585dcdd7fe0930f7d6b1894513c3a Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Fri, 20 Sep 2024 23:07:52 +0200
Subject: [PATCH] taille header

---
 .../dist/assets/css/bundle.css                | 30 +++++++++++++++----
 .../src/assets/scss/global/_layout.scss       |  2 +-
 .../src/assets/scss/partials/header.scss      | 15 ++++++++--
 3 files changed, 39 insertions(+), 8 deletions(-)

diff --git a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
index 4b4f05d..6df1330 100644
--- a/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
+++ b/web/themes/custom/quartiers_de_demain/dist/assets/css/bundle.css
@@ -282,7 +282,7 @@ header .header_left_container #block-quartiers-de-demain-logorepu-2 {
 }
 @media (max-width: 891px) {
   header .header_left_container #block-quartiers-de-demain-logorepu-2 {
-    height: 110px;
+    height: 160px;
   }
 }
 header .header_left_container #block-quartiers-de-demain-logoepau-2 {
@@ -291,7 +291,7 @@ header .header_left_container #block-quartiers-de-demain-logoepau-2 {
 }
 @media (max-width: 891px) {
   header .header_left_container #block-quartiers-de-demain-logoepau-2 {
-    height: 110px;
+    height: 160px;
   }
 }
 header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain {
@@ -301,6 +301,11 @@ header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain .
   width: 90%;
   margin: auto;
 }
+@media (max-width: 1650px) {
+  header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo {
+    width: 80%;
+  }
+}
 header .header_left_container #block-quartiers-de-demain-logoquartiersdedemain .field_field_logo .qdd-header {
   width: 100%;
 }
@@ -313,7 +318,7 @@ header .header_left_container img {
 }
 @media (max-width: 891px) {
   header .header_left_container img {
-    height: 110px;
+    height: 160px;
   }
 }
 @media (max-width: 660px) {
@@ -376,6 +381,11 @@ header .header_nav_container {
   transition: transform 0.3s ease-in-out;
   z-index: -1;
 }
+@media (max-width: 1090px) {
+  header .header_nav_container {
+    text-align: left;
+  }
+}
 @media (max-width: 500px) {
   header .header_nav_container {
     flex: 0 0 40%;
@@ -394,9 +404,14 @@ header .header_nav_container #block-quartiers-de-demain-entete ul {
   padding-right: 1rem;
   margin: 0;
 }
+@media (max-width: 1200px) {
+  header .header_nav_container #block-quartiers-de-demain-entete ul {
+    top: 0;
+  }
+}
 @media (max-width: 810px) {
   header .header_nav_container #block-quartiers-de-demain-entete ul {
-    top: 27.5px;
+    top: 40px;
     align-items: center;
     margin: 1rem;
   }
@@ -413,7 +428,7 @@ header .header_nav_container #block-quartiers-de-demain-entete ul li a {
 }
 @media (max-width: 1090px) {
   header .header_nav_container #block-quartiers-de-demain-entete ul li a {
-    font-size: 0.9rem;
+    font-size: 0.6rem;
   }
 }
 @media (max-width: 500px) {
@@ -457,6 +472,11 @@ header .header:hover + .header_nav_container {
   transform-origin: bottom right;
   transition: all 1s ease-in-out;
 }
+@media (max-width: 1600px) {
+  .header--collapsed {
+    height: 160px;
+  }
+}
 .header--collapsed .qdd-header {
   opacity: 1 !important;
 }
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
index ce0beb6..b840d1c 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/global/_layout.scss
@@ -1,6 +1,6 @@
 
 $header-height : 270px;
-$header-height-pad : 110px;
+$header-height-pad : 160px;
 $header-height-small : 70px;
 $header-height-ultrasmall : 50px;
 $width-menu-slidedown : 550px; 
diff --git a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/header.scss b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/header.scss
index 459bbb6..1c9cff8 100644
--- a/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/header.scss
+++ b/web/themes/custom/quartiers_de_demain/src/assets/scss/partials/header.scss
@@ -49,6 +49,9 @@ header{
             .field_field_logo{
                 width: 90%;
                 margin: auto;
+                @media(max-width: 1650px){
+                    width: 80%;
+                }
                 .qdd-header{
                     width: 100%;
                 }
@@ -116,6 +119,9 @@ header{
         transform: translateX(0);
         transition: transform 0.3s ease-in-out;
         z-index: -1 ;
+        @media(max-width: 1090px){
+            text-align:left;
+        }
         @media(max-width: 500px){
             flex: 0 0 40%;
         }
@@ -133,6 +139,9 @@ header{
                 padding-left: 1rem;
                 padding-right: 1rem;
                 margin: 0;
+                @media(max-width: 1200px){
+                   top:0;
+                }
                 @media(max-width: 810px){
                     top: calc($header-height-pad / 4 );
                     align-items: center;
@@ -143,12 +152,11 @@ header{
                         padding-top: 0.3rem;
                     }
                     a{
-
                         text-transform: uppercase;
                         color: white;
                         font-size: 0.5rem;
                         @media(max-width:1090px){
-                            font-size: 0.9rem;
+                            font-size: 0.6rem;
                         }
                         @media(max-width: 500px){
                             display: flex;
@@ -200,6 +208,9 @@ header{
     width: 45%;
     transform-origin: bottom right; 
     transition: all 1s ease-in-out;
+    @media(max-width: 1600px) {
+        height: $header-height-pad;
+    }
     .qdd-header{
         opacity: 1 !important;
     }