From e6378af234a993c1f896a5b8b4e624069dc28bfb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A8=8B=E5=BA=8F=E5=91=98=E9=98=BF=E6=B1=9F=28Relakkes?=
 =?UTF-8?q?=29?= <relakkes@gmail.com>
Date: Fri, 1 May 2026 20:42:44 +0800
Subject: [PATCH] fix: prevent WebSearch save button wrapping

The WebSearch settings footer placed explanatory copy and the save action in one flex row. On narrower dark-mode layouts, the long localized hint could squeeze the button enough for Chinese text to wrap vertically.

Move the action onto its own right-aligned row and give the button a stable minimum width so the layout remains readable across localized settings screens.

Constraint: Settings screen must support Chinese dark-mode copy without vertical button text.
Rejected: Only widening the button in the same flex row | the hint text can still consume the row and compress the action.
Confidence: high
Scope-risk: narrow
Directive: Keep localized action buttons out of compressible text rows unless the container has explicit width guarantees.
Tested: cd desktop && bun run lint
Tested: agent-browser visual check in light and dark settings pages
---
 desktop/src/pages/Settings.tsx | 21 ++++++++++++---------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/desktop/src/pages/Settings.tsx b/desktop/src/pages/Settings.tsx
index 073dbe34..4fc8b9f2 100644
--- a/desktop/src/pages/Settings.tsx
+++ b/desktop/src/pages/Settings.tsx
@@ -1093,18 +1093,21 @@ function GeneralSettings() {
               </a>
             </div>
           </div>
-          <div className="mt-4 flex items-center justify-between gap-3">
+          <div className="mt-4 flex flex-col gap-3">
             <p className="text-xs text-[var(--color-text-tertiary)] leading-5">
               {t('settings.general.webSearchHint')}
             </p>
-            <Button
-              size="sm"
-              variant="secondary"
-              disabled={!webSearchDirty}
-              onClick={() => void setWebSearch(webSearchDraft)}
-            >
-              {t('settings.general.webSearchSave')}
-            </Button>
+            <div className="flex justify-end">
+              <Button
+                size="sm"
+                variant="secondary"
+                className="min-w-[72px] px-4 whitespace-nowrap"
+                disabled={!webSearchDirty}
+                onClick={() => void setWebSearch(webSearchDraft)}
+              >
+                {t('settings.general.webSearchSave')}
+              </Button>
+            </div>
           </div>
         </div>
       </div>