fixup! feat: add second button which is better aligned

This commit is contained in:
nachtjasmin 2022-10-26 14:25:21 +02:00 committed by Jasmin
parent cc0ef57631
commit cc1ce48234
2 changed files with 13 additions and 7 deletions

View file

@ -4,7 +4,7 @@ import { setupInfoButton } from "./ts/info-menu";
import { initializeMap } from "./ts/map"; import { initializeMap } from "./ts/map";
import "@fontsource/ubuntu/latin.css"; import "@fontsource/ubuntu/latin.css";
import { setupLegend } from "./ts/legend"; import { setupLegend } from "./ts/legend";
import { setupEmergencyButton, setupResetButton, setupHeaderButton } from "./ts/buttons"; import { setupEmergencyButton, setupResetButton, setupHamburgerButton } from "./ts/buttons";
import { addGoatCounter } from "./ts/goatcounter"; import { addGoatCounter } from "./ts/goatcounter";
document.addEventListener("DOMContentLoaded", () => { document.addEventListener("DOMContentLoaded", () => {
@ -14,7 +14,7 @@ document.addEventListener("DOMContentLoaded", () => {
setupLegend(); setupLegend();
setupEmergencyButton(); setupEmergencyButton();
setupResetButton(); setupResetButton();
setupHeaderButton(); setupHamburgerButton();
if (import.meta.env.VITE_QUEER_LEXIKON_PRIVATE === "true") { if (import.meta.env.VITE_QUEER_LEXIKON_PRIVATE === "true") {
addGoatCounter(); addGoatCounter();

View file

@ -17,10 +17,16 @@ export const setupResetButton = () => {
}); });
}; };
export const setupHeaderButton = () => { export const setupHamburgerButton = () => {
const btn = <HTMLButtonElement>document.getElementById("header-button"); let isOpen = false;
const header = <HTMLElement>document.getElementById("mobile-header"); const header = <HTMLElement>document.getElementById("mobile-header");
btn?.addEventListener("click", () => { const hamburger = <HTMLButtonElement>document.getElementById("hamburger-button")!;
header.classList.toggle("max-md:hidden");
}); document.querySelectorAll<HTMLButtonElement>(".js-header-button").forEach((btn) =>
btn.addEventListener("click", () => {
header.classList.toggle("max-md:hidden", isOpen);
hamburger.classList.toggle("hidden", !isOpen);
isOpen = !isOpen;
}),
);
}; };