Refine sidebar worktree list spacing (#565)

This commit is contained in:
Neil
2026-04-12 20:59:43 -07:00
committed by GitHub
parent 23b3f283bc
commit 2926413ba2
2 changed files with 7 additions and 2 deletions
@@ -236,7 +236,7 @@ const WorktreeCard = React.memo(function WorktreeCard({
<WorktreeContextMenu worktree={worktree}>
<div
className={cn(
'group relative flex items-start gap-2.5 px-2 py-2 rounded-lg cursor-pointer transition-all duration-200 outline-none select-none mx-1',
'group relative flex items-start gap-2.5 px-2 py-2 rounded-lg cursor-pointer transition-all duration-200 outline-none select-none ml-1',
isActive
? 'bg-black/[0.06] shadow-[0_1px_2px_rgba(0,0,0,0.03)] border border-border/60 dark:bg-white/[0.10] dark:border-border/40'
: 'border border-transparent hover:bg-accent/40',
@@ -521,7 +521,12 @@ const WorktreeList = React.memo(function WorktreeList() {
aria-orientation="vertical"
aria-activedescendant={activeDescendantId}
onKeyDown={handleContainerKeyDown}
className="flex-1 overflow-auto px-1 scrollbar-sleek scroll-smooth outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset pt-px"
// Why: `scrollbar-gutter: stable` keeps the overflow lane reserved so
// cards do not reflow when the list becomes scrollable. With that lane
// reserved, the right-side list padding is redundant, so keep only the
// left inset and let the scrollbar occupy the reclaimed edge space.
className="flex-1 overflow-auto pl-1 scrollbar-sleek scroll-smooth outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset pt-px"
style={{ scrollbarGutter: 'stable' }}
>
<div
role="presentation"