refactor: distinctive re-use of site header and navbar rename

src/routes/timeline/+page.svelte

@@ -1,17 +1,14 @@
 <script lang="ts">
-	import * as PageHeader from '$lib/components/site/page-header';
 	import { Timeline } from '$lib/components/site/timeline';
+	import { page } from '$app/stores';
+	import { SiteHeader } from '$lib/components/site';
+
+	$: title = $page.data.title;
+	$: subTitle = $page.data.subTitle;
 </script>
 
-<div class="container relative max-w-[980px]">
-	<PageHeader.Root class="pb-8">
-		<PageHeader.Heading>Experiences through time</PageHeader.Heading>
-		<PageHeader.Description>
-			Achievements in my education, career and personal life.
-		</PageHeader.Description>
-	</PageHeader.Root>
+<SiteHeader {title} {subTitle} />
 
-	<section>
-		<Timeline />
-	</section>
-</div>
+<section>
+	<Timeline />
+</section>

src/routes/timeline/+page.ts

@@ -1,6 +1,8 @@
 /** @type {import('./$types').PageLoad} */
 export function load() {
 	return {
-		title: `Timeline`
+		name: `Timeline`,
+		title: `Experiences through time`,
+		subTitle: `Achievements in my education, career and personal life.`
 	};
 }