From 95d1071547e3932f893e29f5a52312e1465a2d1a Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Wed, 28 Feb 2024 11:08:13 +0100
Subject: [PATCH] js & css  header

---
 .../css/quartiers_de_demain.css               | 12 +++---
 .../js/quartiers_de_demain.js                 | 14 ++-----
 .../scss/partials/_header.scss                | 39 +++++--------------
 3 files changed, 20 insertions(+), 45 deletions(-)

diff --git a/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css b/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css
index b24cb45..fb9858f 100644
--- a/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css
+++ b/web/themes/custom/quartiers_de_demain/css/quartiers_de_demain.css
@@ -179,8 +179,6 @@ header {
       content: "/"; }
   header .header_nav_container {
     display: none;
-    grid-template-columns: repeat(12, 1fr);
-    grid-gap: 10px;
     grid-row: 3;
     grid-column: 1 /span 12;
     position: absolute;
@@ -196,11 +194,13 @@ header {
       margin: auto; }
       header .header_nav_container #block-quartiers-de-demain-entete h2 {
         display: none; }
-    header .header_nav_container .close-block {
-      order: 1; }
-  header .close-block, header .open-block, header .open-block.opened {
+  header .display-nav-opened {
+    display: grid;
+    grid-template-columns: repeat(12, 1fr);
+    grid-gap: 10px; }
+  header .open-block, header .open-block.opened {
     cursor: pointer; }
-    header .close-block span, header .open-block span, header .open-block.opened span {
+    header .open-block span, header .open-block.opened span {
       display: block;
       width: 33px;
       height: 2px;
diff --git a/web/themes/custom/quartiers_de_demain/js/quartiers_de_demain.js b/web/themes/custom/quartiers_de_demain/js/quartiers_de_demain.js
index 4173d47..4ef6c26 100644
--- a/web/themes/custom/quartiers_de_demain/js/quartiers_de_demain.js
+++ b/web/themes/custom/quartiers_de_demain/js/quartiers_de_demain.js
@@ -21,18 +21,11 @@
   jQuery(document).ready(function($){
  
 
-
-
-    // $('.close-block').click(function(){
-    //   $(this).parent().fadeOut();
-    //   if(mobile == true){
-    //     $("body").css("overflow","auto");
-    //   }
-    // });
     $('.open-block').click(function(){
-      $(this).prev().css("display","grid");
       $(this).toggleClass('opened');
-   
+
+      $('.header_nav_container').toggleClass('display-nav-opened');
+    
       if(mobile == true){
         $("body").css("overflow","hidden");
       }
@@ -43,6 +36,7 @@
     $('.header_nav_container li').click(function() {
         $('.header_nav_container').fadeOut();
     });
+
 });
   
   
\ No newline at end of file
diff --git a/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss b/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss
index 2f612f5..9fb853b 100644
--- a/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss
+++ b/web/themes/custom/quartiers_de_demain/scss/partials/_header.scss
@@ -64,8 +64,8 @@ header{
     .header_nav_container{
         display: none;
         // display: grid;
-        grid-template-columns: repeat(12, 1fr);
-        grid-gap: 10px;
+        // grid-template-columns: repeat(12, 1fr);
+        // grid-gap: 10px;
         grid-row: 3;
         grid-column: 1 /span 12;
 
@@ -88,13 +88,16 @@ header{
                 display: none;
             }
         }
-        .close-block{
-            order: 1;
-        }
-
     }
     
-    .close-block, .open-block, .open-block.opened{
+    .display-nav-opened{
+        display: grid;
+        grid-template-columns: repeat(12, 1fr);
+        grid-gap: 10px;
+    }
+
+    
+    .open-block, .open-block.opened{
         cursor:pointer;
         span{
             display: block;
@@ -106,28 +109,6 @@ header{
             z-index: 1;
         }
     }
-    // .close-block{
-    //     order: 1;
-    //     grid-column: 12;
-    //     display: none;
-    //     margin: auto;
-    //     span{
-    //         transform-origin: center;
-    //     }
-    //     &>div>span:first-child{
-            
-    //         transform: translateY(57%)rotate(45deg);
-    //     }
-    //     &>div>span:nth-child(2){
-    //         transform: rotate(-45deg);
-    //     }
-    //     // @include breakpoint(small down) {
-    //     //     position: absolute;
-    //     //     top: 1rem;
-    //     //     right: 1rem;
-    //     // }
-    
-    // }
     .open-block{
         height: 100%;
         display: grid;