From 4e10a6525733ce005745bd481e8fc8d6063f7ad8 Mon Sep 17 00:00:00 2001
From: schererleander <leander@schererleander.de>
Date: Wed, 17 Sep 2025 23:55:35 +0200
Subject: feat: change page title

---
 src/pages/Post.tsx | 77 +++++++++++++++++++++++++++++-------------------------
 1 file changed, 42 insertions(+), 35 deletions(-)

(limited to 'src/pages/Post.tsx')

diff --git a/src/pages/Post.tsx b/src/pages/Post.tsx
index a869a26..b4e7151 100644
--- a/src/pages/Post.tsx
+++ b/src/pages/Post.tsx
@@ -1,15 +1,15 @@
 import { useParams, Navigate } from "react-router-dom";
-import type { FC } from "react";
+import { useEffect, type FC } from "react";
 
 interface Meta {
-  title: string;
-  date: string;
-  cover?: string;
+	title: string;
+	date: string;
+	cover?: string;
 }
 
 interface Post {
-  attributes: Meta;
-  ReactComponent: FC;
+	attributes: Meta;
+	ReactComponent: FC;
 }
 
 const posts = import.meta.glob<Post>("../blog/*.md", { eager: true });
@@ -17,33 +17,40 @@ const posts = import.meta.glob<Post>("../blog/*.md", { eager: true });
 const formDate = new Intl.DateTimeFormat("de-DE", { dateStyle: "medium" });
 
 export default function Post() {
-  const { slug } = useParams();
-  
-  const post = posts[`../blog/${slug}.md`];
-
-  if (!post) return <Navigate to="/404" replace />;
-
-  const { attributes: meta, ReactComponent: Content } = post;
-
-  return (
-    <>
-      <a href="/blog" className="no-underline hover:underline">
-        ← Back
-      </a>
-
-      {meta.cover && (
-        <img
-          src={meta.cover}
-          alt={meta.title}
-          className="w-full h-60 object-cover rounded-lg my-6"
-        />
-      )}
-
-      <h1 className="text-2xl font-bold mb-4">{meta.title}</h1>
-      <p className="text-sm text-muted-foreground mb-8">{formDate.format(new Date(meta.date))}</p>
-      <div className="prose prose-neutral max-w-none prose-img:mx-auto prose-img:w-1/2 prose-img:rounded-lg prose-img:shadow-lg dark:prose-invert">
-        <Content />
-      </div>
-    </>
-  );
+	const { slug } = useParams();
+
+	const post = posts[`../blog/${slug}.md`];
+
+	if (!post) return <Navigate to="/404" replace />;
+
+	const { attributes: meta, ReactComponent: Content } = post;
+
+	useEffect(() => {
+		document.title = `߸ ${meta.title}`;
+	}, [meta.title])
+
+	return (
+		<>
+			<title>߸ blog post</title>
+			<main>
+				<a href="/blog" className="no-underline hover:underline">
+					← Back
+				</a>
+
+				{meta.cover && (
+					<img
+						src={meta.cover}
+						alt={meta.title}
+						className="w-full h-60 object-cover rounded-lg my-6"
+					/>
+				)}
+
+				<h1 className="text-2xl font-bold mb-4">{meta.title}</h1>
+				<p className="text-sm text-muted-foreground mb-8">{formDate.format(new Date(meta.date))}</p>
+				<div className="prose prose-neutral max-w-none prose-img:mx-auto prose-img:w-1/2 prose-img:rounded-lg prose-img:shadow-lg dark:prose-invert">
+					<Content />
+				</div>
+			</main>
+		</>
+	);
 }
-- 
cgit v1.3.1

