aboutsummaryrefslogtreecommitdiff
path: root/src/lib/Layout/Popup.svelte
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-10-09 00:41:20 -0700
committerFuwn <[email protected]>2024-10-09 00:41:43 -0700
commit998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch)
tree50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/lib/Layout/Popup.svelte
parentfeat(graphql): add badgeCount field (diff)
downloaddue.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.tar.xz
due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.zip
chore(prettier): use spaces instead of tabs
Diffstat (limited to 'src/lib/Layout/Popup.svelte')
-rw-r--r--src/lib/Layout/Popup.svelte98
1 files changed, 49 insertions, 49 deletions
diff --git a/src/lib/Layout/Popup.svelte b/src/lib/Layout/Popup.svelte
index be55adf0..b82e86c2 100644
--- a/src/lib/Layout/Popup.svelte
+++ b/src/lib/Layout/Popup.svelte
@@ -1,59 +1,59 @@
<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';
- }
- }
+ 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>
+ <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;
- }
+ .popup {
+ z-index: 3;
+ }
+
+ .centered {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
</style>