From 6591e7f33e4e24b748f62815ad17236f5752f977 Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Tue, 14 Apr 2026 17:53:45 +0000
Subject: [PATCH] Fix transparent tooltip background on max projects reached
 tooltip

- Fix z-index class in TooltipContent from invalid z-1000 to z-[1000]
- Add bg-muted to the max projects tooltip for an opaque, visually distinct background

Co-Authored-By: tony@opensecret.cloud <TonyGiorgio@protonmail.com>
---
 frontend/src/components/ChatHistoryList.tsx | 2 +-
 frontend/src/components/ui/tooltip.tsx      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/ChatHistoryList.tsx b/frontend/src/components/ChatHistoryList.tsx
index c8d31492..6d087c33 100644
--- a/frontend/src/components/ChatHistoryList.tsx
+++ b/frontend/src/components/ChatHistoryList.tsx
@@ -1293,7 +1293,7 @@ export function ChatHistoryList({
                   <span>New project</span>
                 </button>
               </TooltipTrigger>
-              <TooltipContent side="bottom">
+              <TooltipContent side="bottom" className="bg-muted">
                 <p>Maximum of {MAX_PROJECTS} projects reached</p>
               </TooltipContent>
             </Tooltip>
diff --git a/frontend/src/components/ui/tooltip.tsx b/frontend/src/components/ui/tooltip.tsx
index c0be6be9..9de99f12 100644
--- a/frontend/src/components/ui/tooltip.tsx
+++ b/frontend/src/components/ui/tooltip.tsx
@@ -17,7 +17,7 @@ const TooltipContent = React.forwardRef<
     ref={ref}
     sideOffset={sideOffset}
     className={cn(
-      "z-1000 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      "z-[1000] overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
       className
     )}
     {...props}