From ad9ac6978e52cbc55bd3d2ec3d22b1f732c61717 Mon Sep 17 00:00:00 2001
From: yyh <yuanyouhuilyz@gmail.com>
Date: Thu, 5 Mar 2026 12:56:55 +0800
Subject: [PATCH] fix(web): align alert card width with API key section in
 dropdown

Change mx-1 (4px) to mx-2 (8px) on CreditsFallbackAlert and
CreditsExhaustedAlert to match ApiKeySection's p-2 (8px) padding,
consistent with Figma design where both sections are 8px from the
dropdown edge.
---
 .../model-auth-dropdown/credits-exhausted-alert.tsx             | 2 +-
 .../model-auth-dropdown/credits-fallback-alert.tsx              | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-exhausted-alert.tsx b/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-exhausted-alert.tsx
index e642df09ed..d7a414c8b2 100644
--- a/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-exhausted-alert.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-exhausted-alert.tsx
@@ -24,7 +24,7 @@ export default function CreditsExhaustedAlert({ hasApiKeyFallback }: CreditsExha
   const usagePercent = totalCredits > 0 ? Math.min((usedCredits / totalCredits) * 100, 100) : 100
 
   return (
-    <div className="mx-1 mb-1 mt-0.5 rounded-lg bg-background-section-burn p-3">
+    <div className="mx-2 mb-1 mt-0.5 rounded-lg bg-background-section-burn p-3">
       <div className="flex flex-col gap-1">
         <div className="text-text-primary system-sm-medium">
           {t(titleKey, { ns: 'common' })}
diff --git a/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-fallback-alert.tsx b/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-fallback-alert.tsx
index 09aded46b4..bc7feb3397 100644
--- a/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-fallback-alert.tsx
+++ b/web/app/components/header/account-setting/model-provider-page/provider-added-card/model-auth-dropdown/credits-fallback-alert.tsx
@@ -12,7 +12,7 @@ export default function CreditsFallbackAlert({ hasCredentials }: CreditsFallback
     : 'modelProvider.card.noApiKeysFallback'
 
   return (
-    <div className="mx-1 mb-1 mt-0.5 rounded-lg bg-background-section-burn p-3">
+    <div className="mx-2 mb-1 mt-0.5 rounded-lg bg-background-section-burn p-3">
       <div className="flex flex-col gap-1">
         <div className="text-text-primary system-sm-medium">
           {t(titleKey, { ns: 'common' })}