Project-Name-Here/hydrationhub
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reintroduce burger nav

Browse Source
This commit is contained in:
Leon Meier 2025-04-21 21:24:52 +02:00
parent ccbcb94449
commit c38be00f73
1 changed files with 69 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
views/partials/nav.eta
View File

@ -6,14 +6,21 @@
<a class="navbar-item primary is-hidden" id="nav_username" href="/">
<strong>Hey, <span id="nav_usernameContent"></span></strong>
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu is-active">
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-end">
<div class="navbar-item" id="dynamic-navbar-buttons">
<!-- Buttons will be dynamically injected here -->
</div>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
const navbarButtons = document.getElementById('dynamic-navbar-buttons');
@ -63,7 +70,17 @@
}
navbarButtons.appendChild(btn);
});
// Burger menu toggle
const burger = document.querySelector('.navbar-burger');
const menu = document.querySelector('.navbar-menu');
if (burger && menu) {
burger.addEventListener('click', () => {
burger.classList.toggle('is-active');
menu.classList.toggle('is-active');
});
}
});
</script>
</div>
</nav>