feat: re-enable client rendering on all pages

This commit is contained in:
Youwen Wu 2024-04-05 02:01:30 -07:00
parent b3b971fad9
commit 64e1ff17af
Signed by: youwen5
GPG key ID: 865658ED1FE61EC3
8 changed files with 103 additions and 18 deletions

View file

@ -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

View file

@ -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 />

View file

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

View file

@ -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>

View file

@ -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

View file

@ -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>

View file

@ -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}`
};
}
};

View file

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