responsive footer

static/js/hamburger.js

@@ -1 +1,25 @@
-function activateHamburger() {}
+const button = document.getElementById("hamburger-button");
+const bg = document.getElementById("hamburger-bg");
+let hidden = true;
+
+export function activateHamburger() {
+  button.addEventListener("click", function () {
+    hidden = !hidden;
+    console.log(hidden);
+    if (hidden === true) {
+      hide();
+    } else {
+      unhide();
+    }
+  });
+}
+
+function unhide() {
+  bg.classList.remove("hidden");
+  button.innerHTML = "窱";
+}
+
+function hide() {
+  bg.classList.add("hidden");
+  button.innerHTML = "";
+}

static/js/lightmode.js

@@ -1,13 +1,16 @@
 const checkbox = document.getElementById("darkmode-toggle");
 const colorswitchers = document.getElementsByClassName("colorswitch");
+const button = document.getElementById("darkmode-button-small");
 
 function switchToLight() {
+  button.innerHTML = "滛";
   for (let item of colorswitchers) {
     item.classList.add("light");
   }
 }
 
 function switchToDark() {
+  button.innerHTML = "";
   for (let item of colorswitchers) {
     console.log(item);
     item.classList.remove("light");
@@ -21,6 +24,10 @@ export function updateMode() {
     switchToDark();
   }
   checkbox.checked = localStorage.getItem("dark");
+
+  button.addEventListener("click", function () {
+    checkbox.click();
+  });
   checkbox.addEventListener("change", function () {
     localStorage.setItem("light", this.checked);
     if (this.checked) {