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

Studio: let the GPU readings truncate instead of overflowing

Browse source 
The three figures carry truncate but sit in a flex row, where the
default min-width:auto stops an item shrinking below its text. The
longest locales would push past the block rather than ellipsize.
This commit is contained in:
Unsloth 2026-07-29 02:35:30 -07:00
commit cf9a9a3682
1 changed files with 6 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

9
studio/frontend/src/features/settings/tabs/resources-tab.tsx
View file

@ -525,16 +525,19 @@ export function ResourcesTab() {
<div className="flex w-[392px] shrink-0 flex-col items-stretch gap-2.5 max-[992px]:w-full">
{/* Ruled between the three readings: run together they are
easy to misread as one number. */}
{/* min-w-0 on each reading, or truncate cannot fire: a flex
item defaults to min-width:auto and the longest locales
would push past the block instead of ellipsizing. */}
<div className="flex items-center justify-between gap-3 font-mono text-ui-11 tabular-nums text-muted-foreground">
<span className="truncate">
<span className="min-w-0 truncate">
{t("settings.resources.gpu.used", { value: usedText })}
</span>
<span aria-hidden className="h-3 w-px shrink-0 bg-border" />
<span className="truncate">
<span className="min-w-0 truncate">
{t("settings.resources.gpu.free", { value: freeText })}
</span>
<span aria-hidden className="h-3 w-px shrink-0 bg-border" />
<span className="truncate">
<span className="min-w-0 truncate">
{t("settings.resources.gpu.total", {
value: totalText,
})}