keb/ginou
1
0
Fork 0
Code Issues 6 Pull Requests Releases Activity

Testing a new style of hamburger menu, CSS based

Browse Source
This commit is contained in:
Théo Marchal
2021-01-09 23:48:45 +01:00
parent 4635a88742
commit 8054ba680f
8 changed files with 44 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
styles/main.css
View File

@ -89,35 +89,32 @@ header nav .mobile-menu-close {
position:absolute;
}
header nav #hamburger .mobile-menu-open {
display:block;
}
header nav.active #hamburger .mobile-menu-open {
display:none;
}
header nav.active #hamburger .mobile-menu-close {
display:block;
}
/*header nav .mobile-menu-open {
display:block;
position:absolute;
right:1rem;
font-size:1.5rem;
header nav #hamburger .container {
display:inline-block;
cursor:pointer;
line-height:2rem;
}*/
/*header nav.active .mobile-menu-close {
display:block;
position:absolute;
right:1rem;
font-size:1.5rem;
cursor:pointer;
line-height:2.5rem;
}*/
}
header nav #hamburger .bar1,
header nav #hamburger .bar2,
header nav #hamburger .bar3 {
width:35px;
height:3px;
background-color:#38686A;
margin:6px 0;
transition:0.4s;
}
header nav.active #hamburger .bar1 {
transform:rotate(-45deg) translate(-4.5px, 6px);
}
header nav.active #hamburger .bar2 {
opacity:0;
}
header nav.active #hamburger .bar3 {
transform:rotate(45deg) translate(-5px, -9.5px);
}
header nav ul li {
display:none;