ceos/unsloth
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Studio: Polish API Providers dialog (#4899)

Browse source 
* fix: lower verbage in API providers page

* fix: fix(studio): tune API Providers dialog width with rem-based responsive caps
This commit is contained in:
Lee Jackson 2026-04-07 17:02:24 +01:00 • committed by GitHub
commit 3d4da72ccf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 6 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

15
studio/frontend/src/features/chat/chat-providers-dialog.tsx
View file

@ -445,8 +445,7 @@ export function ChatProvidersDialog({
<DialogContent
overlayClassName="bg-black/50 backdrop-blur-sm"
className={
// 20% narrower than prior viewport-based widths (multiply by 0.8).
"flex max-h-[90dvh] w-[calc(60vw-1.2rem)] sm:w-[56.4vw] lg:w-[55.2vw] xl:w-[54vw] sm:max-w-none flex-col gap-0 overflow-y-auto p-0"
"flex max-h-[90dvh] w-[96vw] sm:max-w-none md:max-w-[56rem] lg:max-w-[62rem] xl:max-w-[66rem] 2xl:max-w-[70rem] flex-col gap-0 overflow-y-auto p-0"
}
>
<DialogHeader className="shrink-0 space-y-2 px-8 pb-5 pt-8 text-left">
@ -460,8 +459,8 @@ export function ChatProvidersDialog({
</DialogDescription>
</DialogHeader>
<Separator />
<div className="grid min-w-0 grid-cols-1 gap-8 p-8 pt-6 sm:gap-10 md:grid-cols-[minmax(0,1.05fr)_minmax(0,1fr)] md:gap-12 lg:gap-14">
<div className="min-w-0">
<div className="grid min-w-0 grid-cols-1 gap-8 p-8 pt-6 sm:gap-10 md:grid-cols-2 md:gap-0">
<div className="min-w-0 md:pr-8 lg:pr-10">
<div className="mb-5 flex flex-wrap items-end justify-between gap-2">
<h3 className="text-sm font-semibold tracking-tight">Configured providers</h3>
<span className="text-xs tabular-nums text-muted-foreground">
@ -565,7 +564,7 @@ export function ChatProvidersDialog({
)}
</div>
</div>
<div className="min-w-0 border-t border-border/80 pt-8 md:flex md:flex-col md:border-l md:border-t-0 md:pl-10 md:pt-0 lg:pl-12">
<div className="min-w-0 border-t border-border/80 pt-8 md:flex md:flex-col md:border-l md:border-t-0 md:pl-8 md:pt-0 lg:pl-10">
<h3 className="mb-6 text-sm font-semibold tracking-tight">
{editingProviderId ? "Edit provider" : "Add provider"}
</h3>
@ -607,8 +606,7 @@ export function ChatProvidersDialog({
</SelectContent>
</Select>
<p className="text-sm leading-relaxed text-muted-foreground">
Choose a provider from Studio's supported list. Your API key stays on this
device and is encrypted before each request.
Choose a provider from Studio's supported list.
</p>
</div>
@ -639,8 +637,7 @@ export function ChatProvidersDialog({
className="h-10 text-sm"
/>
<p className="text-sm leading-relaxed text-muted-foreground">
Leave blank to use the registry default for this provider type. Set this to
target a custom OpenAI-compatible endpoint.
Leave blank to use the registry default for this provider type.
</p>
</div>