fix(desktop): one 1px border between the panes and the sidebar

Merged
0X
3mo ago
+4-9

Opening a file leads to some "double" borders. It leads to a lot of variance in the different border styles used in the app. There is also a misalignment (shown below) that is fixed.

Top strip alignment

alignment

Pane seams

seams

Full window

Before:

before

After:

after

https://claude.ai/code/session_01AWpYhSNQVyCQWUfuJ4X5bP

Summary by cubic

Ensure a single 1px seam between panes and the right sidebar, and align the sidebar header with the pane tab bar. Old: focused panes drew a 2px border beside a 1px divider (3px seam) and the sidebar header sat lower; New: panes draw no box border, seams are 1px, headers align at 40px; focus is indicated by header opacity.

  • Remove the pane’s 2px focus border in packages/panes Pane; rely on PaneHeader dimming inactive panes.
  • Keep the single 1px seam from the split ResizableHandle and the sidebar ResizablePanel; no adjacent double lines.
  • Set PRActionHeader to h-10 to match the TabBar height in packages/panes.
  • Apply -mt-px to SidebarHeader so its top border shares a row with the tab bar’s bottom border.
  • Scope: v2 workspace only; the v1 route using mosaic-theme.css is unchanged.
  • Review: open two panes next to the right sidebar; seams should be 1px and the two horizontal borders should meet; confirm focus readability without a box outline.

Summary by CodeRabbit

  • Style
    • Adjusted workspace sidebar and pull request header spacing for a more compact layout.
    • Simplified pane borders by removing the active-pane border highlight and transition effect.
    • Preserved existing layout and behavior across workspace navigation and panes.