style desktop nav panel

This commit is contained in:
isUnknown 2024-04-15 13:43:57 +02:00
parent 57e9ca74da
commit 81454b3e4e
16 changed files with 157 additions and 136 deletions

View file

@ -22,36 +22,6 @@ function throttle(callback, limit) {
};
}
function toggleTab(data, tab) {
if (data.activeTab === tab) {
window.scrollTo({
top: 0,
behavior: "smooth",
});
setTimeout(() => {
data.isOpen = false;
data.activeTab = "";
}, 500);
} else {
data.activeTab = tab;
data.isOpen = true;
scrollToElem(".active-tab");
}
}
function scrollToElem(selector) {
document.querySelector(".active-tab").scrollTop = 0;
setTimeout(() => {
const yOffset = -7 * verticalUnit;
const elem = document.querySelector(selector);
const top = elem.getBoundingClientRect().top;
window.scrollTo({
top: top + window.scrollY + yOffset,
behavior: "smooth",
});
}, 100);
}
function setWindowHeightFactor() {
const windowHeight = window.innerHeight;
const min = 650;
@ -111,7 +81,8 @@ function toggleLogoState() {
}
}
function togglePanel(side) {
function togglePanel(side, event) {
event.stopPropagation();
document.querySelector(`.panel--${side}`).classList.toggle("open");
const isOpen = document
.querySelector(`.panel--${side}`)
@ -120,9 +91,11 @@ function togglePanel(side) {
const scrollY = window.scrollY || window.pageYOffset;
if (isOpen) {
document.querySelector("html").style.overflowY = "hidden";
document.querySelector("#main-header").classList.remove("minimized");
} else {
if (window.innerWidth < 640) {
document.querySelector("html").style.overflowY = "hidden";
document.querySelector("#main-header").classList.remove("minimized");
}
} else if (window.innerWidth < 640) {
document.querySelector("html").style.overflowY = "";
if (scrollY > 10) {
document.querySelector("#main-header").classList.add("minimized");
@ -130,6 +103,12 @@ function togglePanel(side) {
}
}
function closePanels() {
document.querySelectorAll(".panel").forEach((panel) => {
panel.classList.remove("open");
});
}
function fixFootNotes() {
const footnotes = document.querySelectorAll('a[href^="#sdfootnote"]');
@ -163,4 +142,18 @@ document.addEventListener("DOMContentLoaded", () => {
setTimeout(() => {
enableToggleEntriesVisibility();
}, 100);
window.addEventListener("click", () => {
closePanels();
});
window.addEventListener("keyup", (event) => {
if (event.key === "Escape") {
closePanels();
}
});
document.querySelectorAll(".panel").forEach((panel) => {
panel.addEventListener("click", (event) => {
event.stopPropagation();
});
});
});