feat: work in progress page

src/pages/404.astro

@@ -16,7 +16,7 @@ const navItems = [
 <Layout>
   <section class="max-w-4xl mb-20 sm:mb-28">
     <h2 class="text-4xl sm:text-5xl lg:text-6xl font-bold leading-[1.1] mb-6 text-neutral-900 dark:text-neutral-100">
-      Seems like you tried to find something that doesn't exist yet.
+      404. Seems like you tried to find something that doesn't exist yet.
     </h2>
     <p class="text-lg sm:text-xl text-neutral-600 dark:text-neutral-400 leading-relaxed max-w-2xl">
       I don't like to remove anything from here, but it can happen from time to time. Or maybe you mistyped something. In any case, my apologies. Feel free to go back to the very beginning if you want.

src/pages/library/[...slug].astro

@@ -0,0 +1,20 @@
+---
+import { type CollectionEntry, getCollection, render } from 'astro:content';
+import PostLayout from '../../layouts/PostLayout.astro';
+
+export async function getStaticPaths() {
+	const posts = await getCollection('workshop');
+	return posts.map((post) => ({
+		params: { slug: post.id },
+		props: post,
+	}));
+}
+type Props = CollectionEntry<'workshop'>;
+
+const post = Astro.props;
+const { Content } = await render(post);
+---
+
+<PostLayout {...post.data}>
+	<Content />
+</PostLayout>

src/pages/library/index.astro

@@ -0,0 +1,39 @@
+<!-- ---
+import "../../styles/global.css"
+import Layout from "../../layouts/Layout.astro"
+import { getCollection } from 'astro:content';
+
+const posts = (await getCollection('workshop')).sort(
+	(a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf(),
+);
+---
+
+<Layout>
+  <section class="max-w-3xl mb-10 sm:mb-14">
+    <h1 class="text-4xl sm:text-5xl font-bold mb-6 text-neutral-900 dark:text-neutral-100">Workshop</h1>
+    <p class="text-lg text-neutral-600 dark:text-neutral-400 leading-relaxed text-justify">
+      I'm a second year computer science student at the European Institute of Technology, still trying to figure out my place but enjoying the journey through systems programming, webdev and other fields. Outside of code, my favorite writer is Isaac Asimov, my favorite piece of music is Spiegel im Spiegel, and my favorite book is The Witches by Roald Dahl. My favorite star is Vega because it was once our north star and will be again in about 12,000 years - something poetic about that cycle. And that's pretty much everything you need to know about me, except maybe my tea preferences, but we'll save that for another time...    </p>
+  </section>
+
+  <ul class="space-y-4">
+    {posts.map((post) => (
+      <li class="p-4 rounded-xl border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-800 hover:shadow-md transition-shadow">
+        <a href={`/workshop/${post.id}/`} class="block">
+          <h4 class="text-xl font-semibold text-neutral-900 dark:text-neutral-100 hover:text-neutral-700 dark:hover:text-neutral-300 transition-colors">
+            {post.data.title}
+          </h4>
+          {post.data.pubDate && (
+            <p class="text-sm text-neutral-500 dark:text-neutral-400 mt-1">
+              {new Date(post.data.pubDate).toLocaleDateString()}
+            </p>
+          )}
+        </a>
+      </li>
+    ))}
+  </ul>
+</Layout> -->
+---
+import WorkInProgress from "../../components/WorkInProgress.astro"
+---
+
+<WorkInProgress />

src/pages/notes/[...slug].astro

@@ -0,0 +1,20 @@
+---
+import { type CollectionEntry, getCollection, render } from 'astro:content';
+import PostLayout from '../../layouts/PostLayout.astro';
+
+export async function getStaticPaths() {
+	const posts = await getCollection('workshop');
+	return posts.map((post) => ({
+		params: { slug: post.id },
+		props: post,
+	}));
+}
+type Props = CollectionEntry<'workshop'>;
+
+const post = Astro.props;
+const { Content } = await render(post);
+---
+
+<PostLayout {...post.data}>
+	<Content />
+</PostLayout>

src/pages/notes/index.astro

@@ -0,0 +1,39 @@
+<!-- ---
+import "../../styles/global.css"
+import Layout from "../../layouts/Layout.astro"
+import { getCollection } from 'astro:content';
+
+const posts = (await getCollection('workshop')).sort(
+	(a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf(),
+);
+---
+
+<Layout>
+  <section class="max-w-3xl mb-10 sm:mb-14">
+    <h1 class="text-4xl sm:text-5xl font-bold mb-6 text-neutral-900 dark:text-neutral-100">Workshop</h1>
+    <p class="text-lg text-neutral-600 dark:text-neutral-400 leading-relaxed text-justify">
+      I'm a second year computer science student at the European Institute of Technology, still trying to figure out my place but enjoying the journey through systems programming, webdev and other fields. Outside of code, my favorite writer is Isaac Asimov, my favorite piece of music is Spiegel im Spiegel, and my favorite book is The Witches by Roald Dahl. My favorite star is Vega because it was once our north star and will be again in about 12,000 years - something poetic about that cycle. And that's pretty much everything you need to know about me, except maybe my tea preferences, but we'll save that for another time...    </p>
+  </section>
+
+  <ul class="space-y-4">
+    {posts.map((post) => (
+      <li class="p-4 rounded-xl border border-neutral-200 dark:border-neutral-700 bg-white dark:bg-neutral-800 hover:shadow-md transition-shadow">
+        <a href={`/workshop/${post.id}/`} class="block">
+          <h4 class="text-xl font-semibold text-neutral-900 dark:text-neutral-100 hover:text-neutral-700 dark:hover:text-neutral-300 transition-colors">
+            {post.data.title}
+          </h4>
+          {post.data.pubDate && (
+            <p class="text-sm text-neutral-500 dark:text-neutral-400 mt-1">
+              {new Date(post.data.pubDate).toLocaleDateString()}
+            </p>
+          )}
+        </a>
+      </li>
+    ))}
+  </ul>
+</Layout> -->
+---
+import WorkInProgress from "../../components/WorkInProgress.astro"
+---
+
+<WorkInProgress />

src/pages/workshop/index.astro

@@ -1,4 +1,4 @@
----
+<!-- ---
 import "../../styles/global.css"
 import Layout from "../../layouts/Layout.astro"
 import { getCollection } from 'astro:content';
@@ -31,4 +31,9 @@ const posts = (await getCollection('workshop')).sort(
       </li>
     ))}
   </ul>
-</Layout>
+</Layout> -->
+---
+import WorkInProgress from "../../components/WorkInProgress.astro"
+---
+
+<WorkInProgress />