瀏覽代碼

header menu déroulant fond blanc & position

ouidade 3 年之前
父節點
當前提交
5193ca86ae

+ 16 - 8
web/themes/custom/eql/css-compiled/styles.css

@@ -163,6 +163,8 @@ a {
       border-bottom: 1px solid #009ee3;
       padding-bottom: 0.5rem;
       padding-top: 0.5rem; }
+      .layout__region--first .block-region-first .block-entity-fieldnodefield-textes .field--name-field-titre:hover {
+        text-decoration: underline; }
 
 .layout__region--second .block-entity-fieldnodefield-textes .field--name-field-titre {
   font-size: 2rem;
@@ -339,29 +341,35 @@ a {
 
 /*partials*/
 .layout-container {
-  position: absolute; }
+  position: relative; }
 
 header {
   display: block;
-  position: sticky;
-  top: 0; }
+  position: sticky; }
 
 #header-top {
-  height: fit-content;
+  height: 7rem;
   background-color: white;
   box-shadow: 1px 0px 8px black;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
-  color: black; }
+  color: black;
+  position: sticky;
+  top: 0%; }
   #header-top .region-header-top-left {
     display: flex;
     flex-direction: row;
     padding: 1rem;
-    align-items: center;
+    align-items: start;
     color: black;
     font-weight: 800; }
+    #header-top .region-header-top-left #block-logogouv {
+      display: flex;
+      height: 100%;
+      align-items: center; }
     #header-top .region-header-top-left ul {
+      position: absolute;
       list-style: none;
       display: flex;
       flex-direction: row; }
@@ -381,8 +389,8 @@ header {
       position: relative; }
     #header-top .region-header-top-left :hover .ul2 {
       display: block;
-      position: relative;
-      transition: ease-in-out 2s; }
+      background-color: white;
+      padding: 1rem; }
   #header-top li .ul1 {
     display: flex;
     flex-direction: column; }

+ 5 - 3
web/themes/custom/eql/scss/pages/_static.scss

@@ -61,9 +61,11 @@
                 padding-bottom: 0.5rem;
                 padding-top: 0.5rem;
                 
-                // &:focus{
-                //     text-decoration: underline;
-                // }
+                &:hover{
+                    text-decoration: underline;
+                }
+
+
                 // &::after{
                 //     border-bottom: olivedrab;
                 // }

+ 23 - 10
web/themes/custom/eql/scss/partials/_header.scss

@@ -1,39 +1,45 @@
 
 .layout-container{
-    position: absolute;
+    position: relative;
 }
 header{
-display: block;
+    display: block;
     position: sticky;
-    top:0;
+
 }
 
 #header-top {
-    height: fit-content;
+    height: 7rem;
     background-color: $white;
     box-shadow: 1px 0px 8px $black;
     display: flex;
     flex-direction: row;
     justify-content: space-between;
     color: $black;
-
+    position: sticky;
+    top:0%;
 
 
     .region-header-top-left {
         display:flex;
         flex-direction: row;
         padding: 1rem;
-        align-items: center;  
+        align-items:start;  
         color: $black;  
         font-weight: 800;
 
-        ul{
+        #block-logogouv{
+            display: flex;
+            height: 100%;
+            align-items: center;
+        }
 
+        ul{
+            position: absolute;
             list-style: none;
             display: flex;
             flex-direction: row;
             li {
-                // background-color: red;
                 padding-right: 1rem;
                 a {
                     color: $black;
@@ -45,6 +51,7 @@ display: block;
             .ul2{
                 flex-direction: column;
                 display: none;
+
             }
             :hover{
                 color: $blue-light;
@@ -59,8 +66,14 @@ display: block;
         :hover {
             .ul2{
                 display: block;
-                position: relative;
-                transition: ease-in-out 2s;
+                background-color: $white;
+                padding: 1rem;
+                // a{
+                //     color: $white;
+                // }
+
+                // position: relative;
+                // transition: ease-in-out 2s;
             }
         }