various polish

Jacky Zhao

2023-07-02 e0ebee5aa9b3646de722f139f1d8d15591df538e

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
function toggleCallout(this: HTMLElement) {
  const outerBlock = this.parentElement!
  this.classList.toggle(`is-collapsed`)
  const collapsed = this.classList.contains(`is-collapsed`)
  const height = collapsed ? this.scrollHeight : outerBlock.scrollHeight
  outerBlock.style.maxHeight = height + `px`
}
 
function setupCallout() {
  const collapsible = document.getElementsByClassName(`callout is-collapsible`) as HTMLCollectionOf<HTMLElement>
  for (const div of collapsible) {
    const title = div.firstElementChild
 
    if (title) {
      title.removeEventListener(`click`, toggleCallout)
      title.addEventListener(`click`, toggleCallout)
 
      const collapsed = div.classList.contains(`is-collapsed`)
      const height = collapsed ? title.scrollHeight : div.scrollHeight
      div.style.maxHeight = height + `px`
    }
  }
}
 
document.addEventListener(`nav`, setupCallout)
window.addEventListener(`resize`, setupCallout)