From b453b32a18770dccee9fd11d9bdb2bbc702b95ef Mon Sep 17 00:00:00 2001
From: Martin Vladic <martin.vladic@gmail.com>
Date: Sat, 14 Dec 2024 22:52:48 +0100
Subject: [PATCH] Update ThemedColorInput.tsx

---
 .../ui-components/PropertyGrid/ThemedColorInput.tsx    | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/packages/project-editor/ui-components/PropertyGrid/ThemedColorInput.tsx b/packages/project-editor/ui-components/PropertyGrid/ThemedColorInput.tsx
index ebcb8947..4a8a9d9b 100644
--- a/packages/project-editor/ui-components/PropertyGrid/ThemedColorInput.tsx
+++ b/packages/project-editor/ui-components/PropertyGrid/ThemedColorInput.tsx
@@ -129,10 +129,15 @@ export const ThemedColorInput = observer(
             if (this.dropDownOpen) {
                 const rectButton = buttonEl.getBoundingClientRect();
 
-                const DROP_DOWN_WIDTH = 280;
+                const DROP_DOWN_WIDTH = 230;
+                const DROP_DOWN_HEIGHT = 268;
 
                 this.dropDownLeft = rectButton.right - DROP_DOWN_WIDTH;
-                this.dropDownTop = rectButton.bottom;
+
+                this.dropDownTop = rectButton.bottom - 9;
+                if (this.dropDownTop + DROP_DOWN_HEIGHT > window.innerHeight) {
+                    this.dropDownTop = window.innerHeight - DROP_DOWN_HEIGHT;
+                }
             }
         });
 
@@ -202,6 +207,7 @@ export const ThemedColorInput = observer(
 
                             this.onChangeColor(color.hex, false);
                         }}
+                        placement={"" as any}
                     />
                 </div>,
                 document.body