summaryrefslogtreecommitdiff
path: root/ping/frontend/src/routes/dashboard/+layout.svelte
diff options
context:
space:
mode:
Diffstat (limited to 'ping/frontend/src/routes/dashboard/+layout.svelte')
-rw-r--r--ping/frontend/src/routes/dashboard/+layout.svelte44
1 files changed, 44 insertions, 0 deletions
diff --git a/ping/frontend/src/routes/dashboard/+layout.svelte b/ping/frontend/src/routes/dashboard/+layout.svelte
new file mode 100644
index 0000000..a2f7efe
--- /dev/null
+++ b/ping/frontend/src/routes/dashboard/+layout.svelte
@@ -0,0 +1,44 @@
+<script lang="ts">
+ import ToastList from '$lib/components/ToastList.svelte';
+ import Avatar from '$lib/components/Avatar.svelte';
+ import NavBar from '$lib/components/NavBar.svelte';
+ import NumberStatList from '$lib/components/NumberStatList.svelte';
+ import SideBar from '$lib/components/SideBar.svelte';
+
+ import '../../app.css';
+ import { getPageIndex, pages } from '$lib/pages';
+ import { onMount } from 'svelte';
+ import { page } from '$app/stores';
+ import { user } from '$lib/stores/auth';
+
+ let { children } = $props();
+
+ let selectedIndex = $state(0);
+
+ $effect(() => {
+ selectedIndex = getPageIndex($page.url.pathname);
+ });
+</script>
+
+<ToastList />
+<NavBar pageTitle={pages[selectedIndex].name}>
+ {#snippet rightComponent()}
+ <div class="flex items-center gap-4">
+ <form>
+ <input type="search" name="search" id="search" placeholder="Search..." />
+ </form>
+ <Avatar username={$user?.login ?? 'No auth'} url={$user?.avatar} />
+ </div>
+ {/snippet}
+</NavBar>
+<SideBar bind:selectedIndex />
+<section class="dashboard">{@render children()}</section>
+
+<style>
+ section.dashboard {
+ padding-left: 208px;
+ padding-top: 72px;
+ width: 100%;
+ height: calc(100vh);
+ }
+</style>