1
Fork 0

Convert layout back to top navbar

It just looks so much better!!
This commit is contained in:
Jake Howard 2020-05-03 11:42:13 +01:00
parent 5da62bcd6e
commit 5979741e0a
Signed by: jake
GPG key ID: 57AFB45680EDD477
3 changed files with 14 additions and 28 deletions

View file

@ -2,8 +2,6 @@
@import "homepage";
$sidenav-width: 275px;
body {
@extend .grey-text, .text-lighten-3;
@ -15,16 +13,10 @@ body {
main {
flex: 1 0 auto;
@media #{$large-and-up} {
margin-left: $sidenav-width;
}
}
footer.page-footer {
padding-top: 0;
z-index: 1;
}
.sidenav {
@ -33,23 +25,14 @@ footer.page-footer {
li > a {
@extend .grey-text, .text-lighten-3;
}
width: $sidenav-width;
@media #{$large-and-up} {
transform: translateX(0) !important;
z-index: 0;
}
}
nav {
@media #{$large-and-up} {
display: none;
}
}
.header-image {
height: $sidenav-width * 1.5;
height: 40vh;
@media #{$medium-and-down} {
height: 60vh;
}
// Fix darkreader weirdness
.parallax {

View file

@ -24,12 +24,17 @@
<nav>
<div class="nav-wrapper black">
<a href="#" class="brand-logo right">Logo</a>
<a href="#" data-target="nav" class="sidenav-trigger">menu</a>
<a href="#" data-target="mobile-nav" class="sidenav-trigger">menu</a>
<ul class="left hide-on-med-and-down">
{% include "navigation/index.html" %}
</ul>
</div>
</nav>
</header>
<ul class="sidenav" id="mobile-nav">
{% include "navigation/index.html" %}
</ul>
<main>
{% block main %}{% endblock %}

View file

@ -1,4 +1,2 @@
<ul class="sidenav" id="nav">
{% include "navigation/item.html" with reverse="homepage" text="Home" %}
{% include "navigation/item.html" with reverse="about" text="About" %}
</ul>
{% include "navigation/item.html" with reverse="homepage" text="Home" %}
{% include "navigation/item.html" with reverse="about" text="About" %}