64 lines
2.3 KiB
TypeScript
64 lines
2.3 KiB
TypeScript
import { getPost } from "@/lib/posts";
|
|
import { notFound } from "next/navigation";
|
|
import Markdown from 'react-markdown';
|
|
import Navbar from "@/components/navbar";
|
|
import RecordBox from "@/components/recordbox";
|
|
|
|
interface PostPageProps {
|
|
params: Promise<{ slug: string }>
|
|
}
|
|
|
|
export default async function PostPage({ params }: PostPageProps) {
|
|
const { slug } = await params
|
|
const post = await getPost(slug)
|
|
|
|
if (!post) {
|
|
notFound()
|
|
}
|
|
|
|
return (
|
|
<div className="min-h-screen bg-black text-white font-mono">
|
|
<Navbar />
|
|
<RecordBox />
|
|
|
|
<title>{post.title}</title>
|
|
<div className="container mx-auto px-4 py-20">
|
|
<div className="max-w-4xl mx-auto">
|
|
|
|
{/* Post content */}
|
|
<article className="prose prose-invert prose-red max-w-none">
|
|
<div className="text-gray-300 leading-relaxed space-y-6">
|
|
<Markdown components={{
|
|
h2(props) {
|
|
return <div className="justify-self-center font-bold text-4xl leading-8 mb-2 mt-12">{props.children}</div>
|
|
},
|
|
h3(props) {
|
|
return <div className="justify-self-center font-medium italic text-2xl leading-8 mb-12">
|
|
<div>{props.children}</div>
|
|
<div className="justify-self-center"><a
|
|
href={"/pdfs/"+post.slug+".pdf"}
|
|
target="_blank"
|
|
className="text-lg not-italic font-normal leading-8 text-red-400 hover:text-red-300 transition-colors mb-12"
|
|
>
|
|
View as PDF
|
|
</a></div>
|
|
</div>
|
|
},
|
|
blockquote(props) {
|
|
return <div className="italic ml-12 mb-2 mt-2">{props.children}</div>
|
|
},
|
|
p(props) {
|
|
return <div className="mt-0 mb-0 text-4 leading-8">{props.children}</div>
|
|
},
|
|
a(props) {
|
|
return <a target="_blank" className="underline underline-offset-8 decoration-red-400 hover:decoration-red-300 hover:text-red-300 transition-colors" href={props.href}>{props.children}</a>
|
|
},
|
|
}}>{post.content}</Markdown>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|