From 0e214f208e55b2540ca9fe3281b40fed595ddebf Mon Sep 17 00:00:00 2001
From: Oleg Isonen <oleg008@gmail.com>
Date: Tue, 20 Dec 2022 10:12:12 +0000
Subject: [PATCH] fix inspector layout when style panel sections are collapsed

it was using flex-direction raw by default which led to that space, no idea though why it worked when opened
---
 apps/designer/app/designer/designer.tsx                  | 1 +
 .../app/designer/features/inspector/inspector.tsx        | 9 ++++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/apps/designer/app/designer/designer.tsx b/apps/designer/app/designer/designer.tsx
index ae52ba215b..abf7fc26cb 100644
--- a/apps/designer/app/designer/designer.tsx
+++ b/apps/designer/app/designer/designer.tsx
@@ -155,6 +155,7 @@ const SidePanel = ({
       css={{
         gridArea,
         display: "flex",
+        flexDirection: "column",
         px: 0,
         fg: 0,
         // Left sidebar tabs won't be able to pop out to the right if we set overflowX to auto.
diff --git a/apps/designer/app/designer/features/inspector/inspector.tsx b/apps/designer/app/designer/features/inspector/inspector.tsx
index b3289348a6..214026d12d 100644
--- a/apps/designer/app/designer/features/inspector/inspector.tsx
+++ b/apps/designer/app/designer/features/inspector/inspector.tsx
@@ -42,7 +42,14 @@ export const Inspector = ({ publish }: InspectorProps) => {
 
   return (
     <FloatingPanelProvider container={tabsRef}>
-      <Tabs defaultValue="style" ref={tabsRef}>
+      <Tabs
+        defaultValue="style"
+        ref={tabsRef}
+        css={{
+          // minHeight is required to get flex item height apply to this container
+          minHeight: 1,
+        }}
+      >
         <TabsList>
           <TabsTrigger value="style">
             <Text>Style</Text>