fix(nav): give the rail and the side panel a dead zone between them
The peek handlers sat on the rail's layout slot, which is 80px wide while the card it holds is only 56px — so the card's own margin was a live hover zone with nothing visible in it. Leaving the filter tab or panel to the left put the cursor straight into it and the rail popped open unprompted; the gap between the two hover zones was literally 0px. Moving the handlers onto the card leaves a 16px no man's land (x=69..85) where neither opens.
This commit is contained in:
@@ -275,11 +275,12 @@ export default function NavSidebar({
|
||||
return (
|
||||
// Layout slot: reserves only the slim footprint when unpinned, so the expanded rail (below)
|
||||
// overlays content instead of pushing it. Pinned reserves the full width (in-flow).
|
||||
<div
|
||||
{...peek.handlers}
|
||||
className={`relative shrink-0 transition-[width] ${pinned ? "w-[232px]" : "w-20"}`}
|
||||
>
|
||||
<div className={`relative shrink-0 transition-[width] ${pinned ? "w-[232px]" : "w-20"}`}>
|
||||
<nav
|
||||
// Peek handlers sit on the CARD, not the slot: the slot is wider than the card by its
|
||||
// margin, and a hover zone out there would fire from the dead space next to the rail —
|
||||
// leaving the side panel to the left would pop the rail open with nothing under the cursor.
|
||||
{...peek.handlers}
|
||||
className={`glass absolute top-0 bottom-0 left-0 z-40 rounded-2xl flex flex-col py-3 m-3 transition-[width] ${
|
||||
slim ? "w-[56px] px-2" : "w-52 px-3"
|
||||
}`}
|
||||
|
||||
Reference in New Issue
Block a user