Skip to content

feat: thin hover-revealed scrollbars with stable pane gutters - #130

Merged
flexdinesh merged 2 commits into
mainfrom
thin-scrollbars
Oct 28, 2026
Merged

flexdinesh merged 2 commits into
mainfrom
thin-scrollbars

Conversation

@flexdinesh

Copy link
Copy Markdown
Owner
  • Behavior owner and resulting change: app shell CSS (tokens.css, style.css, review.css) owns light-DOM scrollbars. Every scroller gets a thin 10px track with a 6px rounded thumb that appears while its pane is hovered or holds focus and darkens on hover/drag, matching Pierre's in-file tracks. Diff viewport, file tree, comments and Reviews column set scrollbar-gutter: stable, so content, tree rows and toolbar actions no longer shift when overflow toggles. Also use-file-navigation.ts: the hide-reviewed hand-off now pins the next file, the same way explicit navigation does.
  • Contracts/invariants affected; local/remote implications: Pierre shadow DOM untouched; itemMetrics.paddingBottom and in-file horizontal measurement unchanged. scrollbar-color is set only for Firefox (@supports not selector(::-webkit-scrollbar)), because it inherits into Pierre's shadow roots and would disable Pierre's Chromium ::-webkit-scrollbar styling. --diff-viewport-inset is now constant at the track size. The hand-off pin fixes a race from feat: Alt+M toggles reviewed on selected file #127: when hide-reviewed handed selection to the next file without a pin, a scroll that landed before the shortened list laid out let followScroll reselect the top file. Under check-runner env (GOMAXPROCS=2) app.spec.ts:1044 failed 10/20 on main. No mode-specific behavior.
  • Validation results; remaining risks: pre-push check:push 104/104. New browser test asserts a constant 10px gutter on the diff viewport and file tree with and without overflow, plus stable tree-row and toolbar edges; it fails with the gutters removed. Alt+M test 20/20 under check-runner env after the fix (main 10/20). Risks: panes reserve 10px even without overflow; macOS overlay-scrollbar users get a classic gutter in Chromium; scroll position is hidden at rest; Firefox picks its own thin width; the outer sidebar can still shift on very short viewports.
  • Intentional architecture/design changes and rationale: DESIGN.md gains a Scrollbars rule (tokens, reveal, which panes get stable gutters, Pierre owns in-file tracks), and the diff gutter wording now says the scrollbar inset is constant.
  • UI evidence: headless Chromium never repaints :hover scrollbar parts, even on a minimal page, so hover reveal was checked in a real browser (thumb shows on diff hover). Light/dark geometry is covered by the existing native-scrollbar spec. Keyboard focus reveal uses :focus-within. Pierre geometry, selection and virtualization are unchanged (existing specs pass).

@flexdinesh
flexdinesh merged commit 0a4e112 into main Oct 28, 2026
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant