zumepro/libre-liberec-web
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix menu button misalign on mobile

Browse Source
This commit is contained in:
Ondřej Mekina
2025-04-20 19:02:59 +02:00
parent d94d4a56b2
commit ea8e5c4da7
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
styles/styles.css
View File

@@ -240,24 +240,24 @@ nav div {
.menu-button .inner div { .menu-button .inner div {
display: block; display: block;
transition: .2s ease opacity, .2s ease transform, .2s ease width; transition: .2s ease opacity, .2s ease transform, .2s ease width;
height: .2em; height: 3px;
width: 2em; width: 30px;
background-color: white; background-color: white;
border-radius: .1em; border-radius: .1em;
margin: .2em 0; margin: 3px 0;
} }
#menu-trigger:checked + .menu-button .center { #menu-trigger:checked + .menu-button .center {
width: 0; width: 0;
transform: translateX(.3em); transform: translateX(4px);
} }
#menu-trigger:checked + .menu-button .upper { #menu-trigger:checked + .menu-button .upper {
transform: translateY(.625em) rotate(45deg); transform: translateY(100%) translateY(6px) rotate(45deg);
} }
#menu-trigger:checked + .menu-button .lower { #menu-trigger:checked + .menu-button .lower {
transform: translateY(-.625em) rotate(-45deg); transform: translateY(-100%) translateY(-6px) rotate(-45deg);
} }
#menu-trigger { #menu-trigger {