octo
/
brutaldon
mirror of https://gitlab.com/brutaldon/brutaldon
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix issue of mobile without javascript not having a menu

This commit is contained in:
Jason McBrayer 2018-05-23 09:52:15 -04:00
parent ff2754e33b
commit 7e449992f4
1 changed files with 21 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
brutaldon/templates/base.html
View File

@ -27,14 +27,8 @@
<img src="{% static "images/brutaldon.png" %}" <img src="{% static "images/brutaldon.png" %}"
width="32" height="32" alt="Brutaldon"> width="32" height="32" alt="Brutaldon">
</a> </a>
<a role="button" class="navbar-burger" aria-label="menu"
aria-expanded="false" data-target="navMenu">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a> <!-- navbar items, navbar burger... -->
</div> </div>
<div class="navbar-menu" id="navMenu"> <div class="navbar-menu is-active" id="navMenu">
<!-- navbar start, navbar end --> <!-- navbar start, navbar end -->
<div class="navbar-start"> <div class="navbar-start">
<a href="{% url "home" %}" class="navbar-item">Home</a> <a href="{% url "home" %}" class="navbar-item">Home</a>
@ -64,6 +58,26 @@
{% if not fullbrutalism %} {% if not fullbrutalism %}
<script type="application/javascript"> <script type="application/javascript">
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {
// Remove is-active from navbar menu
var menu = document.querySelector('#navMenu');
menu.classList.remove('is-active');
// Add the burger
var brand = document.querySelector('.navbar-brand');
var burger = document.createElement('a');
burger.classList.toggle('navbar-burger');
burger.setAttribute("aria-label", "menu");
burger.setAttribute("aria-expanded", "false");
burger.setAttribute("data-target", "navMenu");
for (var index = 0; index < 3; index++)
{
var span = document.createElement('span');
span.setAttribute('aria-hidden', "true");
burger.appendChild(span);
}
brand.appendChild(burger);
// Get all "navbar-burger" elements // Get all "navbar-burger" elements
var $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0); var $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);