fix(shared-ui): add backdrop to ContextMenu to block clicks behind

The context menu was not properly blocking clicks on elements behind it
(like the calendar grid). Added a transparent backdrop overlay that
captures all clicks outside the menu and closes it properly.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Till-JS 2025-12-14 22:46:36 +01:00
parent 9e0c8cbd7d
commit 781225aa68

View file

@ -85,6 +85,17 @@
</script>
{#if visible}
<!-- Backdrop to block clicks on elements behind -->
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div
class="context-menu-backdrop"
onclick={onClose}
oncontextmenu={(e) => {
e.preventDefault();
onClose();
}}
></div>
<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
<div
bind:this={menuElement}
@ -132,6 +143,14 @@
{/if}
<style>
.context-menu-backdrop {
position: fixed;
inset: 0;
z-index: 9998;
/* Transparent backdrop - just blocks clicks */
background: transparent;
}
.context-menu {
position: fixed;
z-index: 9999;