add: added projectsHEADmain

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>