3 files changed, 31 insertions, 14 deletions
diff --git a/src/components/ThemeToggle.tsx b/src/components/ThemeToggle.tsx
index fa269b1..8e1e2aa 100644
--- a/src/components/ThemeToggle.tsx
+++ b/src/components/ThemeToggle.tsx
@@ -13,7 +13,7 @@ export default function ThemeToggle() {
           stroke="currentColor"
           aria-hidden="true"
         >
-          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path></svg>
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path></svg>
       ) : (
         <svg
           className="w-5 h-5"
@@ -22,7 +22,7 @@ export default function ThemeToggle() {
           stroke="currentColor"
           aria-hidden="true"
           >
-            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path></svg>
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path></svg>
       )}
     </button>
   );
diff --git a/src/pages/Blog.tsx b/src/pages/Blog.tsx
index 1b20e89..fa9b609 100644
--- a/src/pages/Blog.tsx
+++ b/src/pages/Blog.tsx
@@ -27,16 +27,18 @@ export default function Blog() {
   return (
     <section className="container mx-auto px-4 py-10">
       <h1 className="text-4xl font-bold mb-8">Blog</h1>
-      
-      {posts.map((post) => (
-        <Link key={post.slug} to={`/blog/${post.slug}`} className="block">
-          <CardLink
-            title={post.title}
-            body={post.excerpt}
-            imgSrc={post.cover}
-          />
-        </Link>
-      ))}
+
+      <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+        {posts.map((post) => (
+          <Link key={post.slug} to={`/blog/${post.slug}`} className="block">
+            <CardLink
+              title={post.title}
+              body={post.excerpt}
+              imgSrc={post.cover}
+            />
+          </Link>
+        ))}
+      </div>
     </section>
   );
 }
 \ No newline at end of file
diff --git a/src/pages/Post.tsx b/src/pages/Post.tsx
index 67f8959..5c0f0ca 100644
--- a/src/pages/Post.tsx
+++ b/src/pages/Post.tsx
@@ -1,4 +1,6 @@
 import { useParams, Link } from "react-router-dom";
+import CodeSnippet from "../components/CodeSnippet";
+import LinkWithIcon from "../components/LinkWithIcon";
 import NotFoundPage from "./404Page";
 
 interface PostFile {
@@ -27,7 +29,7 @@ export default function Post() {
 
   return (
     <article className="prose prose-zinc dark:prose-invert mx-auto px-4 py-10">
-      <Link to="/blog" className="no-underline hover:underline">
+      <Link to="/blog" className="no-underline">
         ← Back
       </Link>
 
@@ -44,7 +46,20 @@ export default function Post() {
         {new Date(meta.date).toLocaleDateString("de-DE")}
       </p>
 
-      <Content />
+      {/* The Markdown, already a React component */}
+      <Content
+        components={{
+          code({ children }: any) {
+            return (
+              <CodeSnippet
+                code={String(children).replace(/\n$/, "")}
+                initialLines={5}
+              />
+            );
+          },
+          a: LinkWithIcon,
+        }}
+      />
     </article>
   );
 }
 \ No newline at end of file