From ac072bf686653a46d8be3dae18fd3ace4d2d920f Mon Sep 17 00:00:00 2001
From: Tim O'Farrell <tofarr@gmail.com>
Date: Fri, 6 Feb 2026 11:05:29 -0700
Subject: [PATCH] feat(frontend): change alert banner from solid background to
 border style (#12783)

Co-authored-by: openhands <openhands@all-hands.dev>
---
 frontend/src/components/features/alerts/alert-banner.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/features/alerts/alert-banner.tsx b/frontend/src/components/features/alerts/alert-banner.tsx
index 982aa5ee32..62a682a545 100644
--- a/frontend/src/components/features/alerts/alert-banner.tsx
+++ b/frontend/src/components/features/alerts/alert-banner.tsx
@@ -116,14 +116,14 @@ export function AlertBanner({
     <div
       data-testid="alert-banner"
       className={cn(
-        "bg-primary text-[#0D0F11] p-4 rounded",
+        "bg-[#0D0F11] border border-primary text-white p-4 rounded",
         "flex flex-row items-center justify-between m-1",
         pathname === "/" && "mt-3 mr-3",
       )}
     >
       <div className="flex items-center">
         <div className="flex-shrink-0">
-          <FaTriangleExclamation className="text-white align-middle" />
+          <FaTriangleExclamation className="text-primary align-middle" />
         </div>
         <div className="ml-3 flex flex-col gap-1">{renderMessages()}</div>
       </div>