shmup/fantasyland
shmup/fantasyland
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Higlight active TOC entry

Browse source
This commit is contained in:
Jared Miller 2025-12-28 05:00:51 -05:00
parent fc26a54f5e
commit 8622392944
No known key found for this signature in database
2 changed files with 17 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
script.js
View file

@ -344,13 +344,20 @@ tocList?.addEventListener("click", (e) => {
} }
}); });
// scroll TOC item into view when navigating via hash // highlight active TOC entry based on hash
window.addEventListener("hashchange", () => { const updateActiveTocEntry = () => {
const id = location.hash.slice(1); const id = location.hash.slice(1);
tocList?.querySelector("a.active")?.classList.remove("active");
if (id) { if (id) {
tocList?.querySelector(`a[href="#${id}"]`)?.scrollIntoView({ block: "nearest" }); const link = tocList?.querySelector(`a[href="#${id}"]`);
link?.classList.add("active");
}
};
window.addEventListener("hashchange", updateActiveTocEntry);
if (location.hash) {
updateActiveTocEntry();
} }
});
// Entry popup preview on hover // Entry popup preview on hover
const popup = document.createElement("div"); const popup = document.createElement("div");

6
style.css
View file

@ -151,6 +151,12 @@ body {
color: var(--accent-deep); color: var(--accent-deep);
} }
.toc-list a.active {
background: rgba(182, 82, 47, 0.22);
color: var(--accent-deep);
font-weight: 600;
}
.content { .content {
background: rgba(255, 255, 255, 0.6); background: rgba(255, 255, 255, 0.6);
border-radius: clamp(12px, 3vw, 24px); border-radius: clamp(12px, 3vw, 24px);