fix(frontend): close the diagonal hover gap in the playlist submenu
The submenu was positioned with a margin gap after the trigger row, so moving the mouse toward it crossed a dead zone with no hovered element and the CSS :hover state dropped, hiding the submenu before the cursor reached it. The gap is now padding on the submenu's own wrapper, which keeps it part of the hoverable box and bridges the trigger to the submenu seamlessly.
This commit is contained in:
@@ -380,9 +380,12 @@
|
||||
<ChevronRight class="h-4 w-4 shrink-0 text-neutral-500" />
|
||||
</div>
|
||||
<div
|
||||
class="invisible absolute top-0 z-50 w-56 rounded-2xl border border-white/10 bg-neutral-900 p-1.5 opacity-0 shadow-[0_12px_28px_-10px_rgba(0,0,0,0.8)] transition group-hover/addmenu:visible group-hover/addmenu:opacity-100 {contextMenu.openLeft
|
||||
? 'right-full mr-1'
|
||||
: 'left-full ml-1'}"
|
||||
class="invisible absolute top-0 z-50 opacity-0 transition group-hover/addmenu:visible group-hover/addmenu:opacity-100 {contextMenu.openLeft
|
||||
? 'right-full pr-1'
|
||||
: 'left-full pl-1'}"
|
||||
>
|
||||
<div
|
||||
class="w-56 rounded-2xl border border-white/10 bg-neutral-900 p-1.5 shadow-[0_12px_28px_-10px_rgba(0,0,0,0.8)]"
|
||||
>
|
||||
<div class="max-h-72 overflow-y-auto">
|
||||
{#each data.playlists as playlist (playlist.id)}
|
||||
@@ -424,4 +427,5 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
Reference in New Issue
Block a user