fix: less shity ux for mobile home nav
This commit is contained in:
parent
6bf1956e4a
commit
a8bed7c7de
3 changed files with 16 additions and 12 deletions
|
@ -190,11 +190,11 @@ function enableTag(node) {
|
||||||
|
|
||||||
// close the menu if on mobile
|
// close the menu if on mobile
|
||||||
if (navEnablerExists) {
|
if (navEnablerExists) {
|
||||||
setTimeout(() => {
|
|
||||||
navOpened = !navOpened
|
navOpened = !navOpened
|
||||||
closeMenu()
|
closeMenu()
|
||||||
location.hash = "#nav-content"
|
document.getElementsByClassName('content')[0].scrollIntoView(true)
|
||||||
}, 200)
|
} else {
|
||||||
|
document.getElementsByClassName('up-footer')[0].scrollIntoView(true)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -74,12 +74,14 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
margin-top: 1.5em;
|
padding-top: 1.5em;
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
Nav
|
||||||
|
**/
|
||||||
|
|
||||||
.nav {
|
.nav {
|
||||||
margin-right: 2em;
|
margin-right: 2em;
|
||||||
|
@ -318,6 +320,7 @@
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
display: block;
|
display: block;
|
||||||
|
padding-top: 1em;
|
||||||
}
|
}
|
||||||
.nav {
|
.nav {
|
||||||
margin-right: 0;
|
margin-right: 0;
|
||||||
|
@ -330,17 +333,17 @@
|
||||||
transform: rotate(-90deg)
|
transform: rotate(-90deg)
|
||||||
}
|
}
|
||||||
#nav-content {
|
#nav-content {
|
||||||
|
overflow: hidden;
|
||||||
max-height: 0;
|
max-height: 0;
|
||||||
transition: max-height 0.1s ease-out;
|
transition: max-height 0.1s ease-out;
|
||||||
}
|
}
|
||||||
|
|
||||||
.before-container {
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-item {
|
.nav-item {
|
||||||
width: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
|
.nav-item:hover {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
.nav-mobile-enabler #nav-enabler-icon {
|
.nav-mobile-enabler #nav-enabler-icon {
|
||||||
transition: all 0.1s ease;
|
transition: all 0.1s ease;
|
||||||
}
|
}
|
||||||
|
@ -349,6 +352,7 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
border-top: 1px solid #C4C4C4;
|
border-top: 1px solid #C4C4C4;
|
||||||
padding-top: 1em;
|
padding-top: 1em;
|
||||||
|
margin-top: .3em;
|
||||||
}
|
}
|
||||||
.mosaic-header {
|
.mosaic-header {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
|
@ -49,7 +49,7 @@ Github: https://github.com/lefuturiste
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="before-container">
|
<div class="">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
|
|
Loading…
Reference in a new issue