add responsive menu

This commit is contained in:
oiseauroch
2023-05-26 17:02:04 +02:00
parent df0cde7f95
commit a5ed3add25
2 changed files with 55 additions and 1 deletions

View File

@ -42,3 +42,43 @@ header {
color: white;
}
}
@media (min-width: 1024px) {
.phone-only {
display: none;
}
}
@media (max-width: 1023px) {
.menu-phone {
position: absolute;
top: 0;
left: 0;
display: flex;
flex-direction: column;
gap: 1em;
padding: 2em;
background-color: white;
}
.hidden-phone {
display: none;
}
}
.hamburger-menu {
font-size: 1.5em;
margin: 0.25em;
font-family: LunaSans;
border: none;
background-color: transparent;
cursor: pointer;
opacity: 65%;
}
.hamburger-menu:hover {
opacity: 100%;
}