fix(chat): make the working status row swap seamlessly into the turn footer

The streaming status line and the finished turn footer are the same visual
line, but the swap used to jump: different font/color, a 2px left inset, a
20px row vs the footer's 32px (its h-8 action buttons set the height), and
the bottom-anchored chat pulling the line up because the finished message
carries more structure below its footer than the status row had.

Match the footer exactly: text-sm at muted-foreground/60, no left inset,
h-8 row, and mb-6 reserving the missing space below. Verified against the
live DOM: the footer appears at the exact pixel position the status row
occupied.
This commit is contained in:
Bohdan Triapitsyn
2026-08-23 00:41:40 +03:00
parent 46426e8495
commit 3195fb1190
2 changed files with 17 additions and 7 deletions
@@ -229,15 +229,19 @@ export function WorkingPlaceholder({
return (
<div
// Styled to mirror the turn footer's model row (text-sm,
// muted-foreground/60, no left inset): when the turn completes this row
// disappears and the footer appears in the same visual spot, so the two
// must read as the same line swapping its text.
className={
'flex h-full items-center text-muted-foreground pl-0.5'
'flex h-full items-center text-muted-foreground/60'
}
role="status"
aria-live={displayedPermission ? 'assertive' : 'polite'}
aria-label={label}
data-waiting={displayedPermission ? 'true' : undefined}
>
<span className="typography-ui-header">
<span className="text-sm">
{hasProviderLogo && providerLogoSrc ? (
<img
src={providerLogoSrc}