Skip to content

Commit 4b6a0c4

Browse files
fix(web): fix native scrollbar being intercepted by sidebar rail on windows and linux (#618)
the rail's 16px hit area at z-20 sits right where the native os scrollbar lives when the sidebar is in offcanvas mode and collapsed. this causes clicks and drags on the scrollbar to toggle the sidebar instead on windows and linux. scoping pointer-events-none to [data-collapsible=offcanvas][data-state=collapsed] fixes the interception without affecting icon mode where the rail needs to stay clickable.
1 parent 304a14d commit 4b6a0c4

1 file changed

Lines changed: 2 additions & 1 deletion

File tree

apps/web/src/components/ui/sidebar.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -566,7 +566,8 @@ function SidebarRail({
566566
<button
567567
aria-label={railLabel}
568568
className={cn(
569-
"-translate-x-1/2 group-data-[side=left]:-right-4 absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=right]:left-0 sm:flex",
569+
/* disable pointer events only when offcanvas sidebar is collapsed, that's when the rail sits over the native scrollbar on windows and linux. icon mode stays fully clickable. */
570+
"-translate-x-1/2 group-data-[side=left]:-right-4 absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=right]:left-0 sm:flex [[data-collapsible=offcanvas][data-state=collapsed]_&]:pointer-events-none",
570571
"in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
571572
"[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
572573
"group-data-[collapsible=offcanvas]:translate-x-0 hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:after:left-full",

0 commit comments

Comments
 (0)