archive/website-2020-spike
Archived
1
Fork 0
Code Releases Packages Activity

Add basic navbar

Browse source
This commit is contained in:
Jake Howard 2020-04-13 11:37:39 +01:00
parent aa54319778
commit 4a31f0fcf6
Signed by: jake
GPG key ID: 57AFB45680EDD477
3 changed files with 54 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
static/src/scss/index.scss
View file

@ -1 +1,15 @@
@import "materialize-css/sass/materialize"; @import "materialize-css/sass/materialize";
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
main {
flex: 1 0 auto;
}
footer.page-footer {
padding-top: 0;
}

38
templates/base.html
View file

@ -16,8 +16,44 @@
</head> </head>
<body> <body>
{% block content %}{% endblock %} <header id="top">
<nav>
<div class="nav-wrapper black">
<a href="#" class="brand-logo right">Logo</a>
<a href="#" data-target="mobile-nav" class="sidenav-trigger">menu</a>
<ul id="nav-mobile" class="left hide-on-med-and-down">
{% include "nav-items.html" %}
</ul>
</div>
</nav>
<ul class="sidenav" id="mobile-nav">
{% include "nav-items.html" %}
</ul>
</header>
<main>
<div class="container">
{% block content %}{% endblock %}
</div>
</main>
<footer class="page-footer black">
<div class="footer-copyright">
<div class="container">
&copy; {% now "Y" %} TheOrangeOne
<a class="grey-text text-lighten-4 right" href="#top">Top</a>
</div>
</div>
</footer>
<script type="text/javascript" src="{% static 'js/materialize.min.js' %}"></script> <script type="text/javascript" src="{% static 'js/materialize.min.js' %}"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var elems = document.querySelectorAll('.sidenav');
var instances = M.Sidenav.init(elems, {});
});
</script>
</body> </body>
</html> </html>

3
templates/nav-items.html Normal file
View file

@ -0,0 +1,3 @@
<li><a href="sass.html">Sass</a></li>
<li><a href="badges.html">Components</a></li>
<li><a href="collapsible.html">JavaScript</a></li>