fix(frontend): assistant messages fill the chat column (#42)

Assistant responses were capped at max-w-[75%] of the column, so long
replies broke into a narrow block with dead space on the right. Cap
only applies to user bubbles now; assistant messages use w-full of the
max-w-3xl content column, matching how ChatGPT/Claude render replies.
Also bumps message vertical spacing from mb-3 to mb-5.

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Manmohan 2026-04-16 20:23:56 -04:00 committed by GitHub
parent 748d2e561c
commit 94bec5f2a0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -75,13 +75,12 @@ export default function MessageBubble({ message, isStreaming }: Props) {
}
return (
<div className={clsx('flex mb-3 animate-fade-in', isUser ? 'justify-end' : 'justify-start')}>
<div className={clsx('flex mb-5 animate-fade-in', isUser ? 'justify-end' : 'justify-start')}>
<div
className={clsx(
'max-w-[85%] md:max-w-[75%]',
isUser
? 'bg-cream dark:bg-ink-elev border border-cream-border dark:border-ink-border rounded-[1.25rem] px-4 py-3'
: 'bg-transparent px-2 py-1',
? 'max-w-[85%] md:max-w-[75%] bg-cream dark:bg-ink-elev border border-cream-border dark:border-ink-border rounded-[1.25rem] px-4 py-3'
: 'w-full bg-transparent px-1 py-1',
)}
>
{!isUser && isStreaming && message.content.length === 0 ? (