quickshell/quickshell-web
3
1
Fork 0
Code Issues Projects Activity

rewrite nav

Browse source
This commit is contained in:
outfoxxed 2024-10-24 16:26:48 -07:00
parent 6249a0aba7
commit 5341fe58d0
Signed by: outfoxxed
GPG key ID: 4C88A185FB89301E
18 changed files with 254 additions and 415 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/Accordion.astro
View file

@ -1,5 +1,5 @@
---
import "@styles/components/accordion.css"
import "@styles/components/accordion.css";
---
<details class=`accordion ${Astro.props.class ?? ""}` {...Astro.props}>
<summary>
@ -19,12 +19,13 @@ import "@styles/components/accordion.css"
const body = accordion.querySelector(".accordion-container") as HTMLDivElement;
summary.addEventListener("click", event => {
if ((event.target as Element).tagName === "A") return;
event.preventDefault();
body.classList.toggle("animate", true);
if (!accordion.open || accordion.classList.contains("closing")) {
accordion.classList.toggle("closing", false);
body.style.setProperty("--height", "0px");
body.classList.toggle("animate", true);
requestAnimationFrame(() => {
accordion.open = true;
@ -34,8 +35,12 @@ import "@styles/components/accordion.css"
body.style.setProperty("--height", body.scrollHeight + "px");
requestAnimationFrame(() => {
accordion.classList.toggle("closing", true);
body.style.setProperty("--height", "0px");
body.classList.toggle("animate", true);
requestAnimationFrame(() => {
accordion.classList.toggle("closing", true);
body.style.setProperty("--height", "0px");
});
});
}
});