From a23594428aedecdd9625f809310a112cafe4030c Mon Sep 17 00:00:00 2001
From: Piyush Gupta <56182734+gupta-piyush19@users.noreply.github.com>
Date: Tue, 19 Aug 2025 12:44:23 +0530
Subject: [PATCH] fix: color picker in product logo (#6434)

Co-authored-by: pandeymangg <anshuman.pandey9999@gmail.com>
---
 .../modules/projects/settings/look/components/edit-logo.tsx  | 1 +
 .../modules/ui/components/advanced-option-toggle/index.tsx   | 5 ++++-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/apps/web/modules/projects/settings/look/components/edit-logo.tsx b/apps/web/modules/projects/settings/look/components/edit-logo.tsx
index af1b9f6f12..6332819c82 100644
--- a/apps/web/modules/projects/settings/look/components/edit-logo.tsx
+++ b/apps/web/modules/projects/settings/look/components/edit-logo.tsx
@@ -179,6 +179,7 @@ export const EditLogo = ({ project, environmentId, isReadOnly }: EditLogoProps)
               description={t("environments.project.look.add_background_color_description")}
               childBorder
               customContainerClass="p-0"
+              childrenContainerClass="overflow-visible"
               disabled={!isEditing}>
               {isBgColorEnabled && (
                 <div className="px-2">
diff --git a/apps/web/modules/ui/components/advanced-option-toggle/index.tsx b/apps/web/modules/ui/components/advanced-option-toggle/index.tsx
index 23f102bedc..ac8b911088 100644
--- a/apps/web/modules/ui/components/advanced-option-toggle/index.tsx
+++ b/apps/web/modules/ui/components/advanced-option-toggle/index.tsx
@@ -12,6 +12,7 @@ interface AdvancedOptionToggleProps {
   childBorder?: boolean;
   customContainerClass?: string;
   disabled?: boolean;
+  childrenContainerClass?: string;
 }
 
 export const AdvancedOptionToggle = ({
@@ -24,6 +25,7 @@ export const AdvancedOptionToggle = ({
   childBorder,
   customContainerClass,
   disabled = false,
+  childrenContainerClass,
 }: AdvancedOptionToggleProps) => {
   return (
     <div className={cn("px-4 py-2", customContainerClass)}>
@@ -40,7 +42,8 @@ export const AdvancedOptionToggle = ({
         <div
           className={cn(
             "mt-4 flex w-full items-center space-x-1 overflow-hidden rounded-lg bg-slate-50",
-            childBorder && "border"
+            childBorder && "border",
+            childrenContainerClass
           )}>
           {children}
         </div>