fix(desktop): match workspace pane tab borders to right sidebar tabs

Merged
KI
3mo ago
+9-9

Summary

  • Workspace pane tabs now use the same inverted border scheme as the right sidebar's Files/Changes/Review tabs: the active tab is outlined on top/left/right with a transparent bottom border and opaque fill so it flows into the content below, while inactive tabs and the rest of the bar carry an unbroken bottom border line.

How It Works

  • TabItem.tsx: active tab gets border border-border border-b-transparent bg-background; inactive tabs get border border-transparent border-b-border. All states keep a 1px border on every side so tabs don't shift when switching.
  • TabBar.tsx: every non-tab region (leading chrome, add-tab button slot, drag filler, overflow add button, trailing controls) carries border-b border-border so the line spans the full bar width. The border lives on each region rather than the bar root, because a root-level border-b would draw a line under the active tab and break the blend-into-content effect.

Testing

  • bun run lint (clean)
  • tsc --noEmit in packages/panes (clean)
  • Manual: verified end-to-end over CDP in the dev desktop app — opened a workspace with two terminal tabs and captured zoomed screenshots of both the pane tab bar and the sidebar tabs; the active tab blends into the content below and the bottom border line runs unbroken under inactive tabs, the + button, and the filler, matching the sidebar treatment.

Summary by cubic

Match workspace pane tab borders to the right sidebar style. Active tabs now flow into content; the bottom border stays continuous under inactive tabs and non-tab regions.

  • Bug Fixes
    • In TabItem.tsx, active tabs use border border-border border-b-transparent bg-background; inactive tabs use border border-transparent border-b-border to avoid layout shift.
    • In TabBar.tsx, add border-b border-border to non-tab regions (leading area, add-tab slots, drag filler, overflow add button, trailing controls) so the bottom line spans the full width.