diff --git a/src/renderer/src/components/sidebar/worktree-list/rows/virtual-row-dispatch.tsx b/src/renderer/src/components/sidebar/worktree-list/rows/virtual-row-dispatch.tsx index 1b3574437fe..1126a898ba3 100644 --- a/src/renderer/src/components/sidebar/worktree-list/rows/virtual-row-dispatch.tsx +++ b/src/renderer/src/components/sidebar/worktree-list/rows/virtual-row-dispatch.tsx @@ -65,7 +65,7 @@ function renderHostHeaderVirtualRow( row: Extract, vItem: VirtualItem ): React.JSX.Element { - // Why: the host card is the outer tier; it pins above group headers (z-30 vs z-20) and stays put as they hand off. + // Incoming hosts must cover the outgoing sticky group before they pin. const isActiveStickyHost = ctx.activeStickyHostIndexRef.current === vItem.index const hasHeaderTopSpacing = shouldUseHeaderTopSpacing({ rows: ctx.renderRows, @@ -83,9 +83,9 @@ function renderHostHeaderVirtualRow( data-index={vItem.index} ref={ctx.measureVirtualRowElement} className={cn( - 'left-0 right-0', + 'left-0 right-0 z-30 bg-worktree-sidebar', hasHeaderTopSpacing && !isActiveStickyHost && 'pt-1', - isActiveStickyHost ? 'sticky -top-px z-30 bg-worktree-sidebar' : 'absolute top-0' + isActiveStickyHost ? 'sticky -top-px' : 'absolute top-0' )} style={isActiveStickyHost ? undefined : { transform: getVirtualRowTransform(vItem.start) }} >