Files
JS/webseite-gulp-ts/frontend/dev/scss/05_modules/_menu-main.scss
Philippe Torrel e2da42e181
2026-08-21 11:02:52 +02:00

77 lines
1.5 KiB
SCSS

.menu-main {
background-color: $color-5;
ul {
padding: 0;
margin: 0;
list-style: none;
}
ul ul {
// display: none; // TODO: change to not visible
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
ul > li:hover,
ul > li:focus,
ul > li:focus-within {
ul {
width: inherit !important;
height: inherit !important;
padding: inherit !important;
margin: inherit !important;
overflow: inherit !important;
clip: inherit !important;
white-space: inherit !important;
border: inherit !important;
}
}
ul.list {
display: flex;
justify-content: center;
li {
a {
display: inline-block;
text-decoration: none;
text-transform: uppercase;
color: $color-white;
padding: 0.5rem 1rem;
transition: all 0.4s ease-out;
&:hover,
&:focus {
background-color: $color-white;
color: $color-5;
}
}
}
}
ul.sublist {
position: absolute;
background-color: rgba($color-5, 0.8);
li {
a {
display: inline-block;
background-color: $color-5;
color: $color-white;
padding: 0.5rem 1rem;
transition: all 0.4s ease-out;
&:hover,
&:focus {
background-color: $color-white;
color: $color-5;
}
}
}
}
}