refactoring avec claude + ajout scroll-margin-top et désaffichage du panel au click sur les liens du toc

This commit is contained in:
antonin gallon 2026-02-17 18:10:04 +01:00
parent d51fc592ed
commit 01c5b098e4
14 changed files with 149 additions and 121 deletions

View file

@ -129,20 +129,24 @@ function subscribe(event) {
}
}
const panelsNav = document.querySelectorAll(".panel");
const panelNavText = document.querySelector(".panel-text");
const panelNavToc = document.querySelector(".panel-toc");
const panels = document.querySelectorAll(".panel[data-panel]");
const navOverlay = document.querySelector("#nav-overlay");
const openNavBtns = document.querySelectorAll("button.open-nav");
const closeNavBtns = document.querySelectorAll(".panel-close");
function closeNav() {
panelsNav.forEach(element => {
element.classList.remove("panel--visible");
});
function closeAllPanels() {
panels.forEach(panel => panel.classList.remove("panel--visible"));
navOverlay.classList.remove("nav-overlay--visible");
document.body.classList.remove("no-scroll");
}
function openPanel(name) {
const panel = document.querySelector(`.panel[data-panel="${name}"]`);
if (panel) {
panel.classList.add("panel--visible");
navOverlay.classList.add("nav-overlay--visible");
document.body.classList.add("no-scroll");
}
}
document.addEventListener("DOMContentLoaded", () => {
ragadjust("h1, h2, h4, h5", ["all"]);
window.window.scrollTo({
@ -166,10 +170,10 @@ document.addEventListener("DOMContentLoaded", () => {
window.addEventListener("keyup", (event) => {
if (event.key === "Escape") {
closeNav();
closeAllPanels();
}
});
document.querySelectorAll(".panel").forEach((panel) => {
panels.forEach((panel) => {
panel.addEventListener("click", (event) => {
event.stopPropagation();
});
@ -201,25 +205,20 @@ document.addEventListener("DOMContentLoaded", () => {
});
});
openNavBtns.forEach((openNavBtn) => {
openNavBtn.addEventListener("click", (event) => {
target = event.currentTarget;
if(target.classList.contains("open-nav_text")){
panelNavText.classList.add("panel--visible");
}else if(target.classList.contains("open-nav_toc")){
panelNavToc.classList.add("panel--visible");
}
navOverlay.classList.add("nav-overlay--visible");
document.body.classList.add("no-scroll");
document.querySelectorAll("[data-open-panel]").forEach((btn) => {
btn.addEventListener("click", () => {
openPanel(btn.dataset.openPanel);
});
});
closeNavBtns.forEach(element => {
element.addEventListener("click", () => {
closeNav();
});
document.querySelectorAll(".panel-close").forEach((btn) => {
btn.addEventListener("click", closeAllPanels);
});
navOverlay.addEventListener("click", () => {
closeNav();
navOverlay.addEventListener("click", closeAllPanels);
// Fermer le panel TOC quand on clique sur un lien
document.querySelectorAll(".panel-toc .toc a").forEach((link) => {
link.addEventListener("click", closeAllPanels);
});
});