mirrors/mCaptcha
1
0
Fork 0
mirror of https://github.com/mCaptcha/mCaptcha.git synced 2025-03-14 13:08:27 +03:00
Code Issues Projects Releases Packages Wiki Activity

navbar animation

Browse source
This commit is contained in:
realaravinth 2021-08-23 18:55:57 +05:30
parent a8c3eaa617
commit b1fd56e9b6
No known key found for this signature in database
GPG key ID: AD9F0F08E855ED88
1 changed files with 37 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
templates/panel/navbar/mobile.scss
View file

@ -16,16 +16,12 @@
*/
@import '../../vars';
$hamburger-menu-animation: 0.3s ease-in;
.secondary-menu {
display: block;
}
.secondary-menu__list {
// position: sticky;
height: 0px;
overflow: hidden;
}
.nav__hamburger-menu {
display: inline-block;
width: 50px;
@ -63,17 +59,48 @@
}
.nav-toggle:not(:checked) ~ .secondary-menu__list {
height: 0px;
// overflow-y: hidden;
// max-height: 100%;
overflow-y: hidden;
max-height: 0;
transition: max-height $hamburger-menu-animation;
}
.nav-toggle:checked ~ .secondary-menu__list {
height: 100%;
max-height: 500px;
overflow-y: auto;
transition: max-height $hamburger-menu-animation;
}
.secondary-menu__brand-name:hover {
color: $light-text;
cursor: pointer;
}
.nav-toggle:checked ~ .secondary-menu__heading {
.nav__hamburger-menu {
span:nth-child(2) {
border: none;
}
span:nth-child(3) {
transform: rotate(-45deg) translate(55%, -15%);
transition: $hamburger-menu-animation;
}
span:first-child {
transform: rotate(45deg) translate(35%, 40%);
transition: $hamburger-menu-animation;
}
}
}
.nav-toggle:not(checked) ~ .secondary-menu__heading {
.nav__hamburger-menu {
span:nth-child(3) {
transition: $hamburger-menu-animation;
}
span:first-child {
transition: $hamburger-menu-animation;
}
}
}