header

web/themes/custom/eql/css-compiled/styles.css

@@ -799,7 +799,8 @@ header {
     #header-top .region-header-top-left ul {
       list-style: none;
       display: flex;
-      flex-direction: row; }
+      flex-direction: row;
+      width: 100%; }
       #header-top .region-header-top-left ul :is(.sous-liste) {
         display: flex;
         flex-direction: column;
@@ -812,15 +813,25 @@ header {
         color: #009ee3; }
       #header-top .region-header-top-left ul li :hover {
         color: #009ee3; }
-    #header-top .region-header-top-left ul:is(.ul1 .sous-liste .ul2) {
+    #header-top .region-header-top-left ul div:first-child li div {
+      display: none; }
+    #header-top .region-header-top-left ul div:nth-child(2) li div {
       display: none; }
-    #header-top .region-header-top-left :hover ul:is(.ul1 .sous-liste .ul2) {
+    #header-top .region-header-top-left :hover ul div:first-child li div {
+      display: block;
+      background-color: white;
+      padding: 1rem; }
+      #header-top .region-header-top-left :hover ul div:first-child li div a {
+        color: black; }
+        #header-top .region-header-top-left :hover ul div:first-child li div a:hover {
+          color: #009ee3; }
+    #header-top .region-header-top-left :hover ul div:nth-child(2) li div {
       display: block;
       background-color: white;
       padding: 1rem; }
-      #header-top .region-header-top-left :hover ul:is(.ul1 .sous-liste .ul2) a {
+      #header-top .region-header-top-left :hover ul div:nth-child(2) li div a {
         color: black; }
-        #header-top .region-header-top-left :hover ul:is(.ul1 .sous-liste .ul2) a:hover {
+        #header-top .region-header-top-left :hover ul div:nth-child(2) li div a:hover {
           color: #009ee3; }
   #header-top #block-burger {
     z-index: 1;

web/themes/custom/eql/scss/partials/_header.scss

@@ -55,6 +55,7 @@ header{
             list-style: none;
             display: flex;
             flex-direction: row;
+            width: 100%;
             :is(.sous-liste){
                 display: flex;
                 flex-direction: column;
@@ -64,7 +65,6 @@ header{
                 padding-right: 2rem;
             }
             li{
-
                 a {
                     color: $black;
                 }
@@ -76,11 +76,17 @@ header{
                 }
             }
         }
-        ul:is(.ul1 .sous-liste .ul2){
+        ul div:first-child li div{
+            display: none;
+        }
+        ul div:nth-child(2) li div{
             display: none;
         }
-        :hover {
-            ul:is(.ul1 .sous-liste .ul2){
+        // ul:is(.ul1 .sous-liste .ul2){
+        //     display: none;
+        // }
+        :hover  ul div:first-child{
+            li div{
                 display: block;
                 background-color: $white;
                 padding: 1rem;
@@ -91,7 +97,20 @@ header{
                     }  
                 }
             }
-        }
+        }    
+            :hover ul div:nth-child(2){
+                li div{
+                    display: block;
+                    background-color: $white;
+                    padding: 1rem;
+                    a{
+                        color: $black;
+                        &:hover{
+                            color: $blue-light;
+                        }  
+                    }
+                }
+            }
     } 
 
     #block-burger {              // menu burger à droite