feat(desktop): add boxless text button variant; use for aux-model actions

New reusable `text` variant renders a button as inline label text (no
bg/border, muted -> foreground, underline-on-hover affordance). Emphasize the
actionable word by adding `font-semibold`/`underline` at the call site. Applied
to the auxiliary-model "Set to main" (plain), "Change" and "Reset all to main"
(bold + underlined) actions, replacing the boxed ghost/outline buttons.
This commit is contained in:
Brooklyn Nicholson
2026-06-03 21:59:44 -05:00
parent 1e1ab31ad6
commit fb0250ef63
2 changed files with 10 additions and 4 deletions

View File

@ -244,10 +244,11 @@ export function ModelSettings({ onMainModelChanged }: ModelSettingsProps) {
<div className="mb-2.5 flex items-center justify-between">
<SectionHeading icon={Cpu} title="Auxiliary models" />
<Button
className="font-semibold underline"
disabled={!mainModel || applying}
onClick={() => void resetAuxiliaryModels()}
size="sm"
variant="outline"
variant="text"
>
Reset all to main
</Button>
@ -270,15 +271,16 @@ export function ModelSettings({ onMainModelChanged }: ModelSettingsProps) {
disabled={!mainModel || applying}
onClick={() => void setAuxiliaryToMain(meta.key)}
size="sm"
variant="ghost"
variant="text"
>
Set to main
</Button>
<Button
className="font-semibold underline"
disabled={!providers.length || applying}
onClick={() => beginAuxiliaryEdit(meta.key)}
size="sm"
variant="outline"
variant="text"
>
Change
</Button>

View File

@ -19,7 +19,11 @@ const buttonVariants = cva(
'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50',
secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
link: 'text-primary underline-offset-4 decoration-current/20 hover:underline'
link: 'text-primary underline-offset-4 decoration-current/20 hover:underline',
// Boxless inline-text action (no bg/border). Reads as label text; add
// `font-semibold` and/or `underline` at the call site to emphasize the
// actionable word (e.g. a "Change" affordance next to muted copy).
text: 'text-muted-foreground underline-offset-4 hover:text-foreground hover:underline'
},
size: {
default: 'px-3 py-1 has-[>svg]:px-2.5',