Initial commit

2026-02-09 12:54:10 +01:00
commit bfefaa0055
23 changed files with 9076 additions and 0 deletions
--- a/src/pages/blog/[slug].astro
+++ b/src/pages/blog/[slug].astro
@@ -0,0 +1,132 @@
+---
+import { getEntry } from "astro:content";
+import Layout from "../../layouts/Layout.astro";
+
+const { slug } = Astro.params;
+if (!slug) {
+    return Astro.redirect("/404");
+}
+
+const entry = await getEntry("blog", slug);
+
+if (!entry) {
+    return Astro.redirect("/404");
+}
+
+const { Content } = await entry.render();
+---
+
+<Layout title={entry.data.title} showScroll={true}>
+    <main>
+        <article>
+            <section class="h-entry">
+                <header>
+                    <h1 class="p-name">{entry.data.title}</h1>
+                    <div class="metadata">
+                        <time
+                            class="dt-published"
+                            datetime={entry.data.pubDate.toISOString()}
+                        >
+                            {entry.data.pubDate.toISOString().slice(0, 10)}
+                        </time>
+                        {
+                            entry.data.updatedDate && (
+                                <div class="last-updated">
+                                    Last updated on{" "}
+                                    <time>
+                                        {entry.data.updatedDate
+                                            .toISOString()
+                                            .slice(0, 10)}
+                                    </time>
+                                </div>
+                            )
+                        }
+                    </div>
+                </header>
+                <div class="e-content">
+                    <Content />
+                </div>
+            </section>
+        </article>
+    </main>
+</Layout>
+
+<style>
+    main {
+        width: calc(100% - 2em);
+        max-width: 800px;
+        margin: 0;
+        padding: 2em;
+    }
+
+    header {
+        margin-bottom: 2rem;
+    }
+
+    header a {
+        display: inline-block;
+        margin-bottom: 1rem;
+        color: var(--text-color);
+        opacity: 0.6;
+        font-family: var(--font-mono);
+    }
+
+    header a:hover {
+        opacity: 1;
+    }
+
+    .title {
+        font-size: 2em;
+        margin: 0.25em 0 0;
+    }
+
+    hr {
+        border-top: 1px solid var(--text-color);
+        opacity: 0.3;
+        margin: 1rem 0;
+    }
+
+    .metadata {
+        font-family: var(--font-mono);
+        color: var(--text-color);
+        opacity: 0.8;
+        font-size: 0.9rem;
+    }
+
+    /* Markdown Styles */
+    .e-content {
+        line-height: 1.6;
+        font-family: var(--font-mono); /* Keep vibe */
+        font-size: 1rem;
+    }
+
+    .e-content :global(h1),
+    .e-content :global(h2),
+    .e-content :global(h3),
+    .e-content :global(h4) {
+        margin-top: 2rem;
+        margin-bottom: 1rem;
+        color: var(--text-color);
+        font-weight: bold;
+    }
+
+    .e-content :global(a) {
+        color: var(--text-color);
+        text-decoration: underline;
+    }
+
+    .e-content :global(code) {
+        background: #111;
+        padding: 2px 5px;
+        border-radius: 2px;
+        font-family: var(--font-mono);
+        color: #fff;
+    }
+
+    .e-content :global(pre) {
+        background: #111;
+        padding: 1rem;
+        border: 1px solid #333;
+        overflow-x: auto;
+    }
+</style>