diff options
| author | Fuwn <[email protected]> | 2024-02-04 23:30:56 -0800 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-02-04 23:30:56 -0800 |
| commit | 70f5666437f87ed723a862924215e057cd0d5678 (patch) | |
| tree | f456440645f3cfe33a7077d3553a11bc2ebb5b1a /src/lib/Loading | |
| parent | feat(popup): blur fullscreen backdrop (diff) | |
| download | due.moe-70f5666437f87ed723a862924215e057cd0d5678.tar.xz due.moe-70f5666437f87ed723a862924215e057cd0d5678.zip | |
feat(message): use fullscreen popup
Diffstat (limited to 'src/lib/Loading')
| -rw-r--r-- | src/lib/Loading/Message.svelte | 35 |
1 files changed, 22 insertions, 13 deletions
diff --git a/src/lib/Loading/Message.svelte b/src/lib/Loading/Message.svelte index 82e6d312..8715b922 100644 --- a/src/lib/Loading/Message.svelte +++ b/src/lib/Loading/Message.svelte @@ -2,24 +2,33 @@ import Ellipsis from './Ellipsis.svelte'; import Ripple from './Ripple.svelte'; import Grid from './Grid.svelte'; + import Popup from '$lib/Popup.svelte'; export let message: string | undefined = undefined; export let loader: 'ellipsis' | 'ripple' | 'grid' = 'ellipsis'; export let colour = 'var(--fg)'; </script> -<div class="card popup"> - {#if loader === 'ellipsis'} - <Ellipsis {colour} /> - {:else if loader === 'ripple'} - <Ripple {colour} /> - {:else if loader === 'grid'} - <Grid {colour} /> - {/if} +<Popup fullscreen> + <div class="message"> + {#if loader === 'ellipsis'} + <Ellipsis {colour} /> + {:else if loader === 'ripple'} + <Ripple {colour} /> + {:else if loader === 'grid'} + <Grid {colour} /> + {/if} - {#if message} - <p /> + {#if message} + <p /> - {message} - {/if} -</div> + {message} + {/if} + </div> +</Popup> + +<style> + .message { + text-align: center; + } +</style> |