smyalygames/quartz
Template
1
0
Fork 0
mirror of https://github.com/jackyzha0/quartz.git synced 2025-05-18 22:44:14 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixed second ToC element not collapsible or highlight-able

Browse Source
This commit is contained in:
Stephen Tse 2024-10-12 13:20:11 -07:00
parent 0d1f15d37c
commit c8a649d222
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
quartz/components/scripts/toc.inline.ts
View File

@ -2,13 +2,13 @@ const bufferPx = 150
const observer = new IntersectionObserver((entries) => { const observer = new IntersectionObserver((entries) => {
for (const entry of entries) { for (const entry of entries) {
const slug = entry.target.id const slug = entry.target.id
const tocEntryElement = document.querySelector(`a[data-for="${slug}"]`) const tocEntryElements = document.querySelectorAll(`a[data-for="${slug}"]`)
const windowHeight = entry.rootBounds?.height const windowHeight = entry.rootBounds?.height
if (windowHeight && tocEntryElement) { if (windowHeight && tocEntryElements.length > 0) {
if (entry.boundingClientRect.y < windowHeight) { if (entry.boundingClientRect.y < windowHeight) {
tocEntryElement.classList.add("in-view") tocEntryElements.forEach((tocEntryElement) => tocEntryElement.classList.add("in-view"))
} else { } else {
tocEntryElement.classList.remove("in-view") tocEntryElements.forEach((tocEntryElement) => tocEntryElement.classList.remove("in-view"))
} }
} }
} }
@ -26,14 +26,14 @@ function toggleToc(this: HTMLElement) {
} }
function setupToc() { function setupToc() {
const toc = document.getElementById("toc") const tocs = document.querySelectorAll("[id=toc]")
if (toc) { tocs.forEach((toc) => {
const collapsed = toc.classList.contains("collapsed") const collapsed = toc.classList.contains("collapsed")
const content = toc.nextElementSibling as HTMLElement | undefined const content = toc.nextElementSibling as HTMLElement | undefined
if (!content) return if (!content) return
toc.addEventListener("click", toggleToc) toc.addEventListener("click", toggleToc)
window.addCleanup(() => toc.removeEventListener("click", toggleToc)) window.addCleanup(() => toc.removeEventListener("click", toggleToc))
} })
} }
window.addEventListener("resize", setupToc) window.addEventListener("resize", setupToc)