diff options
| author | Fuwn <[email protected]> | 2024-04-21 19:51:49 -0700 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-04-21 19:51:49 -0700 |
| commit | eebeaa378d49cc8adb597d00fd05bcc314779888 (patch) | |
| tree | d2862e4f952525280a341e44810c261548a07a3f /src/lib/Popup.svelte | |
| parent | refactor(TextTransition): move to Layout (diff) | |
| download | due.moe-eebeaa378d49cc8adb597d00fd05bcc314779888.tar.xz due.moe-eebeaa378d49cc8adb597d00fd05bcc314779888.zip | |
refactor(lib): move componenets to modules
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> |