Jacky Zhao
2024-02-02 c00089bd5728188ce554303b5b18754467c97c85
quartz/components/scripts/callout.inline.ts
@@ -1,21 +1,21 @@
function toggleCallout(this: HTMLElement) {
  const outerBlock = this.parentElement!
  outerBlock.classList.toggle(`is-collapsed`)
  const collapsed = outerBlock.classList.contains(`is-collapsed`)
  outerBlock.classList.toggle("is-collapsed")
  const collapsed = outerBlock.classList.contains("is-collapsed")
  const height = collapsed ? this.scrollHeight : outerBlock.scrollHeight
  outerBlock.style.maxHeight = height + `px`
  outerBlock.style.maxHeight = height + "px"
  // walk and adjust height of all parents
  let current = outerBlock
  let parent = outerBlock.parentElement
  while (parent) {
    if (!parent.classList.contains(`callout`)) {
    if (!parent.classList.contains("callout")) {
      return
    }
    const collapsed = parent.classList.contains(`is-collapsed`)
    const collapsed = parent.classList.contains("is-collapsed")
    const height = collapsed ? parent.scrollHeight : parent.scrollHeight + current.scrollHeight
    parent.style.maxHeight = height + `px`
    parent.style.maxHeight = height + "px"
    current = parent
    parent = parent.parentElement
@@ -30,15 +30,15 @@
    const title = div.firstElementChild
    if (title) {
      title.removeEventListener(`click`, toggleCallout)
      title.addEventListener(`click`, toggleCallout)
      title.addEventListener("click", toggleCallout)
      window.addCleanup(() => title.removeEventListener("click", toggleCallout))
      const collapsed = div.classList.contains(`is-collapsed`)
      const collapsed = div.classList.contains("is-collapsed")
      const height = collapsed ? title.scrollHeight : div.scrollHeight
      div.style.maxHeight = height + `px`
      div.style.maxHeight = height + "px"
    }
  }
}
document.addEventListener(`nav`, setupCallout)
window.addEventListener(`resize`, setupCallout)
document.addEventListener("nav", setupCallout)
window.addEventListener("resize", setupCallout)