mirror of
https://github.com/kmc7468/arkvault.git
synced 2025-12-14 22:08:45 +00:00
32 lines
860 B
Svelte
32 lines
860 B
Svelte
<script lang="ts">
|
|
import type { Snippet } from "svelte";
|
|
import { fade, fly } from "svelte/transition";
|
|
|
|
interface Props {
|
|
children: Snippet;
|
|
isOpen: boolean;
|
|
}
|
|
|
|
let { children, isOpen = $bindable() }: Props = $props();
|
|
</script>
|
|
|
|
{#if isOpen}
|
|
<!-- svelte-ignore a11y_click_events_have_key_events -->
|
|
<!-- svelte-ignore a11y_no_static_element_interactions -->
|
|
<div
|
|
onclick={() => {
|
|
isOpen = false;
|
|
}}
|
|
class="fixed inset-0 flex items-end justify-center"
|
|
>
|
|
<div class="absolute inset-0 bg-black bg-opacity-50" transition:fade={{ duration: 100 }}></div>
|
|
<div
|
|
onclick={(e) => e.stopPropagation()}
|
|
class="z-10 flex max-h-[70vh] min-h-[30vh] w-full items-stretch rounded-t-2xl bg-white p-4"
|
|
transition:fly={{ y: 100, duration: 200 }}
|
|
>
|
|
{@render children?.()}
|
|
</div>
|
|
</div>
|
|
{/if}
|