Make the navbar collapse button work

src/lib/js/index.ts

@@ -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 {};

src/lib/scss/_custom-bulma.scss

@@ -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-color: $grey-light;
-$input-placeholder-color: $grey-darker; // Some opacity is applied to this
+$input-placeholder-color: $grey-light; // Some opacity is applied to this
-$input-focus-color: $black;
 
 $weight-normal: 400;
 
-$body-background-color: $black;
+$scheme-main: $black;
 
 $family-sans-serif: Nunito, $family-sans-serif;
 $family-monospace: Hack, $family-monospace;