Files
ontvlambaar/src/app/header/header.component.scss
Arne Vlaeminck 6d5d30cb9a
All checks were successful
Copy Files to Samba Share dev / Copy Files (push) Successful in 22s
Fixed header on mobile
2024-10-31 21:41:08 +01:00

73 lines
1.1 KiB
SCSS

@import "../../vars.scss";
ul {
list-style: none;
display: flex;
justify-content: center;
gap: 3rem;
height: 6rem;
width: 100%;
li {
align-content: center;
font-size: 1.5rem;
}
}
a {
text-decoration: none;
color: var(--text-color);
}
svg {
display: none;
}
@media only screen and (max-width: $small-screen) {
.nav {
flex-direction: column;
align-items: flex-start;
position: absolute;
width: fit-content;
height: fit-content;
top: 5rem;
z-index: 200;
max-height: 0;
transition: max-height 0.5s ease;
overflow: hidden;
gap: 0;
left: 50%;
transform: translateX(-50%);
padding: 0;
&.collapsed {
max-height: 10rem;
transition: max-height 0.5s ease;
overflow: hidden;
}
li {
background-color: var(--background-color);
z-index: 200;
height: 3rem;
width: 100%;
}
a {
padding: 1rem;
}
}
svg {
display: inline;
height: 4rem;
width: 100%;
margin: 1rem;
}
path {
fill: var(--accent-color);
}
}