diff options
Diffstat (limited to 'src/lib/Popup.svelte')
| -rw-r--r-- | src/lib/Popup.svelte | 59 |
1 files changed, 0 insertions, 59 deletions
diff --git a/src/lib/Popup.svelte b/src/lib/Popup.svelte deleted file mode 100644 index be55adf0..00000000 --- a/src/lib/Popup.svelte +++ /dev/null @@ -1,59 +0,0 @@ -<script lang="ts"> - import { browser } from '$app/environment'; - import { onMount } from 'svelte'; - - export let onLeave = () => { - return; - }; - export let card = true; - export let smallCard = false; - export let fullscreen = false; - export let show = true; - export let locked = false; - export let center = false; - - const handleClickOutside = (event: any) => { - if (!locked && event.target.classList.contains('popup')) { - show = false; - - onLeave(); - } - }; - - onMount(() => { - if (browser) document.body.style.overflow = 'auto'; - }); - - $: { - if (browser) { - document.body.style.overflow = 'auto'; - - if (show) document.body.style.overflow = 'hidden'; - else document.body.style.overflow = 'auto'; - } - } -</script> - -<svelte:window on:click={handleClickOutside} /> - -{#if show} - <div class={`popup ${fullscreen ? 'popup-fullscreen' : ''}`}> - <span - class={`${card ? `card ${smallCard ? 'card-small' : ''}` : ''} ${center ? 'centered' : ''}`} - > - <slot /> - </span> - </div> -{/if} - -<style> - .popup { - z-index: 3; - } - - .centered { - display: flex; - justify-content: center; - align-items: center; - } -</style> |