klmp200/Sith
1
0
Fork 0
mirror of https://github.com/ae-utbm/sith.git synced 2025-07-10 11:59:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve accordion animation

Browse Source
This commit is contained in:
Antoine Bartuccio
2025-06-05 20:37:58 +02:00
parent d58c713fc5
commit 4774a7b741
2 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
core/static/bundled/core/accordion-index.ts
View File

@ -1,11 +1,19 @@
const setMaxHeight = (element: HTMLDetailsElement) => {
element.setAttribute("style", `max-height: ${element.scrollHeight}px`);
const updateMaxHeight = (element: HTMLDetailsElement) => {
const content = element.querySelector(".accordion-content") as HTMLElement | null;
if (!content) {
return;
}
if (element.hasAttribute("open")) {
content.style.maxHeight = `${content.scrollHeight}px`;
} else {
content.style.maxHeight = "0px";
}
};
// Initialize max-height at load
window.addEventListener("DOMContentLoaded", () => {
for (const el of document.querySelectorAll("details.accordion")) {
setMaxHeight(el as HTMLDetailsElement);
updateMaxHeight(el as HTMLDetailsElement);
}
});
@ -16,7 +24,7 @@ new MutationObserver((mutations: MutationRecord[]) => {
if (target.tagName !== "DETAILS" || !target.classList.contains("accordion")) {
continue;
}
setMaxHeight(target);
updateMaxHeight(target);
}
}).observe(document.body, {
attributes: true,