From c89f8b1a9a20becd982ed0b4bc88b1685a15832d Mon Sep 17 00:00:00 2001 From: Jacky Zhao Date: Sat, 12 Aug 2023 10:33:57 -0700 Subject: [PATCH] fix nested callout folding --- content/features/upcoming features.md | 1 - quartz/components/scripts/callout.inline.ts | 16 ++++++++++++++++ quartz/styles/callouts.scss | 1 + 3 files changed, 17 insertions(+), 1 deletion(-) diff --git a/content/features/upcoming features.md b/content/features/upcoming features.md index 728d16a..d2a7617 100644 --- a/content/features/upcoming features.md +++ b/content/features/upcoming features.md @@ -4,7 +4,6 @@ draft: true ## todo -- blockquote with link in first child broken - 404 using base url - back button with anchors / popovers + spa is broken - search should be fast for large repos diff --git a/quartz/components/scripts/callout.inline.ts b/quartz/components/scripts/callout.inline.ts index 556ef3c..d8cf518 100644 --- a/quartz/components/scripts/callout.inline.ts +++ b/quartz/components/scripts/callout.inline.ts @@ -4,6 +4,22 @@ function toggleCallout(this: HTMLElement) { const collapsed = outerBlock.classList.contains(`is-collapsed`) const height = collapsed ? this.scrollHeight : outerBlock.scrollHeight 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`)) { + return + } + + const collapsed = parent.classList.contains(`is-collapsed`) + const height = collapsed ? parent.scrollHeight : parent.scrollHeight + current.scrollHeight + parent.style.maxHeight = height + `px` + + current = parent + parent = parent.parentElement + } } function setupCallout() { diff --git a/quartz/styles/callouts.scss b/quartz/styles/callouts.scss index 149321c..ad99165 100644 --- a/quartz/styles/callouts.scss +++ b/quartz/styles/callouts.scss @@ -7,6 +7,7 @@ padding: 0 1rem; overflow-y: hidden; transition: max-height 0.3s ease; + box-sizing: border-box; & > *:nth-child(2) { margin-top: 0;