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
This commit is contained in:
程序员阿江(Relakkes) 2026-05-01 20:42:44 +08:00
parent 3e62c15406
commit e6378af234

View File

@ -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>