bachir/d9-eql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

menu animation

Browse Source
This commit is contained in:
ouidade
2025-05-15 11:20:43 +02:00
parent f74ef1208d
commit 90e2ee0805
2 changed files with 34 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/dist/assets/css/bundle.css
Vendored
+16 -7
View File
@@ -5823,26 +5823,33 @@ svg.ext {
color: rgb(0, 158, 227); color: rgb(0, 158, 227);
} }
#header-top .region-header-top-left ul ul { #header-top .region-header-top-left ul ul {
position: absolute;
left: -28%;
z-index: 1000;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
display: none; min-width: 210px;
min-width: 100px; width: fit-content;
width: 100%;
justify-content: space-between; justify-content: space-between;
padding-inline-start: 0px; padding-inline-start: 0px;
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: opacity 0.3s ease, transform 0.3s ease;
} }
#header-top .region-header-top-left ul ul .is-active { #header-top .region-header-top-left ul ul .is-active {
color: rgb(0, 158, 227); color: rgb(0, 158, 227);
} }
#header-top .region-header-top-left ul li { #header-top .region-header-top-left ul li {
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
padding-bottom: 0.8rem; padding-bottom: 0.8rem;
max-width: inherit; max-width: inherit;
width: 25%; padding-left: 1rem;
align-items: center; padding-right: 0.5rem;
height: 20px; height: fit-content;
} }
#header-top .region-header-top-left ul li a { #header-top .region-header-top-left ul li a {
color: rgb(0, 0, 0); color: rgb(0, 0, 0);
@@ -5854,7 +5861,9 @@ svg.ext {
color: rgb(0, 158, 227); color: rgb(0, 158, 227);
} }
#header-top .region-header-top-left ul li:hover ul { #header-top .region-header-top-left ul li:hover ul {
display: block; opacity: 1;
visibility: visible;
transform: translateY(0);
} }
#header-top .region-header-top-left ul .ul1.sous-liste.ul2 { #header-top .region-header-top-left ul .ul1.sous-liste.ul2 {
padding-left: 1rem; padding-left: 1rem;
web/themes/custom/eql/scss/partials/_header.scss
+18 -20
View File
@@ -81,8 +81,6 @@
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
// padding-left: 3rem;
// margin-right: 20px;
width: 100%; width: 100%;
padding-inline-start: 0px; padding-inline-start: 0px;
padding: 1rem; padding: 1rem;
@@ -90,36 +88,35 @@
color:$blue-light; color:$blue-light;
} }
ul{ ul{
position: absolute;
left: -28%;
z-index: 1000;
// display: none;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
display: none; min-width: 210px;
min-width: 100px; width: fit-content;
width: 100%;
justify-content: space-between; justify-content: space-between;
// background:$white;
// padding-inline-start: 0;
padding-inline-start: 0px; padding-inline-start: 0px;
.is-active{ .is-active{
color:$blue-light; color:$blue-light;
} }
opacity: 0;
visibility: hidden;
transform: translateY(-10px);
transition: opacity 0.3s ease, transform 0.3s ease;
} }
li{ li{
position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// justify-content: space-between;
background-color: $white; background-color: $white;
padding-bottom: 0.8rem; padding-bottom: 0.8rem;
max-width: inherit; max-width: inherit;
width: 25%; padding-left: 1rem;
align-items: center; padding-right: 0.5rem;
// padding-left: 1rem; height: fit-content;
height: 20px;
// text-align: none
// .menuOpen{
// display: flex;
// }
a { a {
color: $black; color: $black;
} }
@@ -132,12 +129,13 @@
} }
li:hover ul { li:hover ul {
display: block; opacity: 1;
visibility: visible;
transform: translateY(0);
} }
.ul1.sous-liste.ul2{ .ul1.sous-liste.ul2{
padding-left: 1rem; padding-left: 1rem;
// width: 200px;
} }
} }