feat: re-enable client rendering on all pages

src/lib/components/Navbar/Navbar.svelte

@@ -13,6 +13,8 @@
 
 	const updateCurrent = () => {
 		const path = window.location.pathname;
+		console.log(path);
+		console.log(path.split('/'));
 		if (path === '/') {
 			current = 'home';
 		} else {
@@ -22,6 +24,7 @@
 	};
 
 	onMount(() => {
+		console.log('test');
 		return navigating.subscribe(updateCurrent);
 	});
 </script>
@@ -32,7 +35,7 @@
 		{#if current === 'blog'}
 			<Coredump height="95%" href="/blog" />
 		{:else}
-			<Name height="100%" href="/" />
+			<Name height="95%" href="/" />
 		{/if}
 		<div class="gap-4 lg:gap-14 justify-around align-middle hidden md:flex">
 			<a

src/routes/+layout.svelte

@@ -8,6 +8,11 @@
 	import '@fontsource/merriweather/latin.css';
 	import Footer from '$lib/components/Footer.svelte';
 	import { Toaster } from '$lib/components/ui/sonner';
+	import { onMount } from 'svelte';
+
+	onMount(() => {
+		console.log('Hello from the layout!');
+	});
 </script>
 
 <Toaster />

src/routes/about/+page.ts

@@ -1,2 +1 @@
-export const csr = false;
-export const prerender = true;
+export const prerender = true;

src/routes/blog/+page.svelte

@@ -1,20 +1,11 @@
 <script lang="ts">
 	import ChevronRight from 'svelte-radix/ChevronRight.svelte';
+	import * as Card from '$lib/components/ui/card';
 	import Code from 'svelte-radix/Code.svelte';
 	import type { PageData } from './$types.js';
 	// import { config } from '$lib/stores/index.js';
 	import { cn } from '$lib/utils.js';
-	import Article from '$lib/components/Blog/Article.svelte';
-
-	let doc = {
-		title: 'Test Post',
-		description: 'An insightful and succinct blurb about the post.'
-	};
-
-	export let data: PageData;
-	$: markdown = data.markdown;
-	// $: doc = data.metadata;
-	// $: componentSource = data.metadata.source?.replace('default', $config.style ?? 'default');
+	import Separator from '$lib/components/ui/separator/separator.svelte';
 </script>
 
 <svelte:head>
@@ -23,6 +14,40 @@
 	<meta name="author" content="Youwen Wu" />
 </svelte:head>
 
-<main class="max-w-4xl md:mx-auto mx-4 mt-8 mb-14">
-	<Article title={doc.title} description={doc.description} content={markdown} />
+<main class="dots-background">
+	<div class="container max-w-5xl md:mx-auto mx-4 py-8 my-1">
+		<h1 class="text-5xl md:text-6xl font-serif font-bold mt-14 sm:mt-18">The Coredump</h1>
+		<p class="text-xl sm:text-2xl text-muted-foreground mt-6">
+			My blog on computer science, math, and more.
+		</p>
+		<div class="grid grid-cols-3 mt-20 gap-2 sm:gap-4">
+			<div class="col-span-2">
+				<h2 class="text-3xl font-serif font-bold">Latest Posts</h2>
+				<div class="grid grid-cols-1 gap-4 mt-4"></div>
+			</div>
+			<Card.Root class="col-span-1 bg-secondary border-primary/10 bg-opacity-75 backdrop-blur-sm">
+				<Card.Header>
+					<h2 class="text-3xl font-serif font-bold mb-8">Archive</h2>
+					<h3 class="text-3xl font-serif font-medium text-muted-foreground">2024</h3>
+					<Separator class="mt-2 mb-4" />
+				</Card.Header>
+				<Card.Content>
+					{#each Array(5) as _, i}
+						<div class="grid grid-cols-1 gap-2 mt-8">
+							<h3 class="text-2xl font-serif font-bold">Post Title</h3>
+							<p class="text-lg text-muted-foreground">
+								An insightful and succinct blurb about the post.
+							</p>
+							<div class="flex items-center gap-2">
+								<a href="/blog/2021/01" class="text-primary hover:underline text-lg font-serif"
+									>Read more</a
+								>
+								<ChevronRight class="w-6 h-6 text-primary" />
+							</div>
+						</div>
+					{/each}
+				</Card.Content>
+			</Card.Root>
+		</div>
+	</div>
 </main>

src/routes/blog/+page.ts

@@ -4,7 +4,6 @@ import markedKatex from 'marked-katex-extension';
 import markedAlert from 'marked-alert';
 
 export const prerender = true;
-export const csr = false;
 
 const options = {
 	throwOnError: false

src/routes/blog/[year]/[slug]/+page.svelte

@@ -0,0 +1,28 @@
+<script lang="ts">
+	import ChevronRight from 'svelte-radix/ChevronRight.svelte';
+	import Code from 'svelte-radix/Code.svelte';
+	import type { PageData } from './$types.js';
+	// import { config } from '$lib/stores/index.js';
+	import { cn } from '$lib/utils.js';
+	import Article from '$lib/components/Blog/Article.svelte';
+
+	let doc = {
+		title: 'Test Post',
+		description: 'An insightful and succinct blurb about the post.'
+	};
+
+	export let data: PageData;
+	$: markdown = data.markdown;
+	// $: doc = data.metadata;
+	// $: componentSource = data.metadata.source?.replace('default', $config.style ?? 'default');
+</script>
+
+<svelte:head>
+	<title>{doc.title} | The Coredump</title>
+	<meta name="description" content={doc.description} />
+	<meta name="author" content="Youwen Wu" />
+</svelte:head>
+
+<main class="max-w-4xl md:mx-auto mx-4 mt-8 mb-14">
+	<Article title={doc.title} description={doc.description} content={markdown} />
+</main>

src/routes/blog/[year]/[slug]/+page.ts

@@ -0,0 +1,27 @@
+import type { PageLoad } from './$types.js';
+import { marked } from 'marked';
+import markedKatex from 'marked-katex-extension';
+import markedAlert from 'marked-alert';
+
+export const prerender = true;
+
+const options = {
+	throwOnError: false
+};
+marked.use(markedKatex(options));
+marked.use(markedAlert());
+
+export const load: PageLoad = async ({ fetch }) => {
+	try {
+		const data = await fetch('/test.md');
+		const markdown = await marked.parse(await data.text());
+
+		return {
+			markdown
+		};
+	} catch (e) {
+		return {
+			markdown: `Error: ${e}`
+		};
+	}
+};

src/routes/portfolio/+page.ts

@@ -1,2 +1 @@
 export const prerender = true;
-export const csr = false;