diff options
Diffstat (limited to '')
-rw-r--r-- | clients/www/src/app.d.ts | 12 | ||||
-rw-r--r-- | clients/www/src/app.html | 12 | ||||
-rw-r--r-- | clients/www/src/app.postcss | 9 | ||||
-rw-r--r-- | clients/www/src/lib/offlineToast.ts | 33 | ||||
-rw-r--r-- | clients/www/src/routes/+layout.svelte | 33 | ||||
-rw-r--r-- | clients/www/src/routes/+layout.ts | 1 | ||||
-rw-r--r-- | clients/www/src/routes/+page.svelte | 1 |
7 files changed, 101 insertions, 0 deletions
diff --git a/clients/www/src/app.d.ts b/clients/www/src/app.d.ts new file mode 100644 index 0000000..4c48b71 --- /dev/null +++ b/clients/www/src/app.d.ts @@ -0,0 +1,12 @@ +// See https://kit.svelte.dev/docs/types#app +// for information about these interfaces +// and what to do when importing types + +import 'vite-plugin-pwa/info' + +declare namespace App { + // interface Locals {} + // interface PageData {} + // interface Error {} + // interface Platform {} +} diff --git a/clients/www/src/app.html b/clients/www/src/app.html new file mode 100644 index 0000000..fff52f4 --- /dev/null +++ b/clients/www/src/app.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<html lang="en" class="dark"> + <head> + <meta charset="utf-8" /> + <link rel="icon" href="%sveltekit.assets%/img/favicon.png" /> + <meta name="viewport" content="width=device-width" /> + %sveltekit.head% + </head> + <body data-sveltekit-preload-data="hover" data-theme="vintage"> + <div style="display: contents" class="h-full overflow-hidden">%sveltekit.body%</div> + </body> +</html> diff --git a/clients/www/src/app.postcss b/clients/www/src/app.postcss new file mode 100644 index 0000000..ddaec40 --- /dev/null +++ b/clients/www/src/app.postcss @@ -0,0 +1,9 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; +@tailwind variants; + +html, +body { + @apply h-full overflow-hidden; +}
\ No newline at end of file diff --git a/clients/www/src/lib/offlineToast.ts b/clients/www/src/lib/offlineToast.ts new file mode 100644 index 0000000..3ae943e --- /dev/null +++ b/clients/www/src/lib/offlineToast.ts @@ -0,0 +1,33 @@ +import { getToastStore, type ToastSettings } from '@skeletonlabs/skeleton'; + +const toastStore = getToastStore(); + +const offline: ToastSettings = { + message: 'You are currently offline.', + background: 'variant-filled-error', + autohide: false +}; + +const online: ToastSettings = { + message: 'You are back online.', + background: 'variant-filled-success', + autohide: true, + timeout: 3000 +}; + +/** + * Make a toast for if the PWA is ever brought offline for whatever reason. + */ +export default function offlineToast() { + window.addEventListener('offline', () => { + toastStore.clear(); + toastStore.trigger(offline); + }); + + window.addEventListener('online', () => { + toastStore.clear(); + setTimeout(() => { + toastStore.trigger(online); + }, 300); + }); +} diff --git a/clients/www/src/routes/+layout.svelte b/clients/www/src/routes/+layout.svelte new file mode 100644 index 0000000..15780c3 --- /dev/null +++ b/clients/www/src/routes/+layout.svelte @@ -0,0 +1,33 @@ +<script lang="ts"> + import '../app.postcss'; + import { AppShell, AppBar, LightSwitch, initializeStores } from '@skeletonlabs/skeleton'; + + import { pwaInfo } from 'virtual:pwa-info'; + + $: webManifest = pwaInfo ? pwaInfo.webManifest.linkTag : ''; + + initializeStores(); +</script> + +<svelte:head> + <!-- eslint-disable-next-line svelte/no-at-html-tags VitePWA can probably be trusted --> + {@html webManifest} +</svelte:head> + +<!-- App Shell --> +<AppShell> + <svelte:fragment slot="header"> + <!-- App Bar --> + <AppBar gridColumns="grid-cols-3" slotDefault="place-self-center" slotTrail="place-content-end"> + <svelte:fragment slot="lead"> + <LightSwitch /> + </svelte:fragment> + <a href="#">Zelda: Oracle Password Generator</a> + <svelte:fragment slot="trail"> + <a href="#">TODO: SOURCE CODE</a> + </svelte:fragment> + </AppBar> + </svelte:fragment> + <!-- Page Route Content --> + <slot /> +</AppShell> diff --git a/clients/www/src/routes/+layout.ts b/clients/www/src/routes/+layout.ts new file mode 100644 index 0000000..c8cacf0 --- /dev/null +++ b/clients/www/src/routes/+layout.ts @@ -0,0 +1 @@ +export const prerender = true;
\ No newline at end of file diff --git a/clients/www/src/routes/+page.svelte b/clients/www/src/routes/+page.svelte new file mode 100644 index 0000000..2ea190a --- /dev/null +++ b/clients/www/src/routes/+page.svelte @@ -0,0 +1 @@ +TODO: Draw the rest of the owl
\ No newline at end of file |