header menu déroulant fond blanc & position

This commit is contained in:
2021-11-19 17:24:17 +01:00
parent a7718ef9be
commit 5193ca86ae
3 changed files with 44 additions and 21 deletions
+16 -8
View File
@@ -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; }
@@ -61,9 +61,11 @@
padding-bottom: 0.5rem;
padding-top: 0.5rem;
// &:focus{
// text-decoration: underline;
// }
&:hover{
text-decoration: underline;
}
// &::after{
// border-bottom: olivedrab;
// }
@@ -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;
}
}