From d8f92c1bfc7b5aaaba93d53794461f15ad1ab09c Mon Sep 17 00:00:00 2001
From: Strek <ssharishkumar@gmail.com>
Date: Sat, 7 May 2022 23:59:37 +0530
Subject: [PATCH] Fixes layout shift (#4640)

---
 beta/src/components/MDX/ExpandableCallout.tsx | 1 +
 beta/src/styles/sandpack.css                  | 6 ++++++
 2 files changed, 7 insertions(+)

diff --git a/beta/src/components/MDX/ExpandableCallout.tsx b/beta/src/components/MDX/ExpandableCallout.tsx
index 3354da8b..c4fc53c6 100644
--- a/beta/src/components/MDX/ExpandableCallout.tsx
+++ b/beta/src/components/MDX/ExpandableCallout.tsx
@@ -41,6 +41,7 @@ function ExpandableCallout({children, type}: ExpandableCalloutProps) {
   return (
     <div
       className={cn(
+        'expandable-callout',
         'pt-8 pb-4 px-5 sm:px-8 my-8 relative rounded-none shadow-inner -mx-5 sm:mx-auto sm:rounded-lg',
         variant.containerClasses
       )}>
diff --git a/beta/src/styles/sandpack.css b/beta/src/styles/sandpack.css
index ef06f43c..13b1efb0 100644
--- a/beta/src/styles/sandpack.css
+++ b/beta/src/styles/sandpack.css
@@ -302,3 +302,9 @@ html.dark .sp-devtools > div {
     max-height: unset;
   }
 }
+
+.expandable-callout .sp-stack:nth-child(2) {
+  min-width: 431px;
+  min-height: 40vh;
+  max-height: 40vh;
+}