Widen the work drawer and match generic card styling

The drawer grows to w-96 so the PR card's stats fit, and the container
wash is gone: the branch chip and card use the same attachment styling
as the generic link chips, directly on the chat background.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
klopez4212
2026-07-07 07:46:16 +01:00
co-authored by Claude Fable 5
parent 090d5f6d9c
commit f8a84deb63
@@ -35,25 +35,21 @@ export function ChatWorkPanel({
aria-hidden={!open}
className={cn(
"flex shrink-0 flex-col overflow-hidden transition-[width,opacity] duration-300 ease-out",
open ? "w-80 opacity-100" : "pointer-events-none w-0 opacity-0",
open ? "w-96 opacity-100" : "pointer-events-none w-0 opacity-0",
)}
data-testid="chat-work-panel"
>
{/* Fixed-width inner wrapper so content never reflows mid-slide. */}
<div className="w-80 overflow-y-auto py-4 pl-1 pr-4">
<div className="flex flex-col gap-3 rounded-2xl bg-muted/40 p-3">
<div className="w-96 overflow-y-auto py-4 pl-1 pr-4">
<div className="flex flex-col gap-2">
{branch ? (
<div className="flex items-center gap-1.5 rounded-lg bg-background/60 px-3 py-2 text-xs">
// Same attachment styling as the generic link chips.
<div className="flex items-center gap-1.5 rounded-2xl border border-border/70 bg-muted/30 px-3 py-2.5 text-xs">
<GitBranch className="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
<span className="min-w-0 truncate font-mono">{branch}</span>
</div>
) : null}
<GithubPullRequestCard
// Matches the branch chip: the card needs its own surface on the
// secondary container or the two read as one flat block.
className="w-full border-transparent bg-background/60 hover:bg-background/80"
preview={preview}
/>
<GithubPullRequestCard className="w-full" preview={preview} />
</div>
</div>
</aside>