From c89f8b1a9a20becd982ed0b4bc88b1685a15832d Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
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 728d16a3..d2a7617d 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 556ef3cd..d8cf5180 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 149321c8..ad991658 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;