Make the navbar collapse button work

This commit is contained in:
Tristan Daniël Maat 2022-08-13 20:54:26 +01:00
parent 86b6e1a246
commit 0aa62525cb
Signed by: tlater
GPG key ID: 49670FD774E43268
2 changed files with 33 additions and 5 deletions

View file

@ -1,4 +1,4 @@
document.addEventListener("DOMContentLoaded", () => {
function registerFlashCloseButtons() {
const flashButtons = document.querySelectorAll(".notification .delete");
flashButtons.forEach((button) => {
@ -39,6 +39,35 @@ document.addEventListener("DOMContentLoaded", () => {
flash.parentNode.parentNode.removeChild(block);
}
});
}
function registerNavCollapseButtons() {
const navbarButtons = document.getElementsByClassName("navbar-burger");
for (const navbarButton of navbarButtons) {
navbarButton.addEventListener("click", () => {
if (
!(navbarButton instanceof HTMLElement) ||
!navbarButton.dataset.target
) {
throw new Error("invalid navbar button");
}
const target = document.getElementById(navbarButton.dataset.target);
if (target === null) {
throw new Error("could not find navbar button target");
}
navbarButton.classList.toggle("is-active");
target.classList.toggle("is-active");
});
}
}
document.addEventListener("DOMContentLoaded", () => {
registerFlashCloseButtons();
registerNavCollapseButtons();
});
export {};

View file

@ -21,13 +21,12 @@ $link: $green;
$link-hover: color.scale($green, $lightness: +10%);
$link-active: color.scale($green, $lightness: +10%);
$link-focus: color.scale($green, $lightness: +10%);
$input-color: $grey-darker;
$input-placeholder-color: $grey-darker; // Some opacity is applied to this
$input-focus-color: $black;
$input-color: $grey-light;
$input-placeholder-color: $grey-light; // Some opacity is applied to this
$weight-normal: 400;
$body-background-color: $black;
$scheme-main: $black;
$family-sans-serif: Nunito, $family-sans-serif;
$family-monospace: Hack, $family-monospace;