peterkrzyzek
/
ghost_leaders_theme
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases Wiki Activity

Update mobile menu animation

This commit is contained in:
John O'Nolan 2019-11-06 18:42:59 +07:00
parent a5e9d12c58
commit 8b39cfca24
3 changed files with 15 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/built/screen.css
View File

File diff suppressed because one or more lines are too long

2
assets/built/screen.css.map
View File

File diff suppressed because one or more lines are too long

31
assets/css/screen.css
View File

@ -211,8 +211,9 @@ body:not(.gh-head-open) .burger:hover .burger-inner::after {
display: inline-block; display: inline-block;
} }
.gh-head { .gh-head {
height: max-content; height: 86px;
transition: all 0.4s ease-out; transition: all 0.4s ease-out;
overflow: hidden;
} }
.gh-head .gh-container { .gh-head .gh-container {
height: 100%; height: 100%;
@ -221,12 +222,14 @@ body:not(.gh-head-open) .burger:hover .burger-inner::after {
} }
.gh-head-actions, .gh-head-actions,
.gh-head-menu { .gh-head-menu {
position: absolute; position: relative;
visibility: hidden; z-index: -1;
opacity: 0; height: auto;
transition: opacity 0.3s ease-in; transition: height 0.2s cubic-bezier(0.4, 0.01, 0.165, 0.99);
} }
.gh-head-brand { .gh-head-brand {
position: relative;
z-index: 10;
grid-column-start: auto; grid-column-start: auto;
max-width: none; max-width: none;
display: flex; display: flex;
@ -235,16 +238,11 @@ body:not(.gh-head-open) .burger:hover .burger-inner::after {
user-select: none; user-select: none;
} }
.gh-head-open { .gh-head-open {
background: rgba(255,255,255,1); background: rgba(0,0,0,1);
transition: background 0.5s ease-out; transition: background 0.5s ease-out;
transition-delay: 0.25; transition-delay: 0.25;
overflow: hidden; overflow: hidden;
height: 100vh; height: 100vh;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
} }
.gh-head-open .gh-head { .gh-head-open .gh-head {
@ -255,12 +253,12 @@ body:not(.gh-head-open) .burger:hover .burger-inner::after {
.gh-head-open .gh-head-actions, .gh-head-open .gh-head-actions,
.gh-head-open .gh-head-menu { .gh-head-open .gh-head-menu {
position: relative; z-index: 9999;
visibility: visible; height: auto;
opacity: 1; transition: height 0.2s cubic-bezier(0.4, 0.01, 0.165, 0.99);
} }
.gh-head-menu { .gh-head-open .gh-head-menu {
align-self: center; align-self: center;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -288,9 +286,6 @@ body:not(.gh-head-open) .burger:hover .burger-inner::after {
/* Footer /* Footer
/* ---------------------------------------------------------- */ /* ---------------------------------------------------------- */
.gh-foot { .gh-foot {