Merge branch 'dev' into blog

Author: lazy-dinosaur

app/(blog)/layout.tsx

@@ -8,11 +8,11 @@ export default function BlogLayout({
 }) {
   return (
     <>
-      <LeftSidebar className="w-48 xl:w-52 2xl:w-56 lg:shrink-0 lg:sticky h-full lg:top-40 mb-4 lg:mb-0 mt-40" />
+      <LeftSidebar className="w-48 xl:w-52 2xl:w-56 lg:shrink-0 lg:sticky h-full lg:top-16 mb-4 lg:mb-0 mt-52" />
       <div className="xl:max-w-5xl mx-auto rounded-lg w-full overflow-x-hidden p-3 2xl:p-6 h-full">
         {children}
       </div>
-      <RightSidebar className="w-48 xl:w-52 2xl:w-56 shrink-0 hidden xl:block sticky top-40 h-full mt-40" />
+      <RightSidebar className="w-48 xl:w-52 2xl:w-56 shrink-0 hidden xl:block sticky top-16 h-full mt-52" />
     </>
   );
 }

app/(blog)/posts/[...slug]/page.tsx

@@ -1,7 +1,8 @@
-import MarkdownRenderer from "@/components/markdown-renderer";
 import Link from "next/link";
-import { getPost, getPosts } from "@/lib/posts";
+import { getPost, getPosts, getAdjacentPosts } from "@/lib/posts";
 import { ArrowLeft } from "lucide-react";
+import PostAnimation from "@/components/post-animation";
+import PostContent from "./post-content";
 
 interface PostPageProps {
   params: Promise<{ slug: string[] }>;
@@ -25,7 +26,7 @@ export default async function PostPage({ params }: PostPageProps) {
 
   if (!post) {
     return (
-      <article className="rounded-lg p-0 xl:lp-8 min-h-[70vh]">
+      <article className="rounded-lg p-2 sm:p-7 max-w-3xl mx-auto">
         <h1 className="text-xl sm:text-2xl font-bold mb-4 sm:mb-6">
           포스트를 찾을 수 없습니다.
         </h1>
@@ -42,29 +43,20 @@ export default async function PostPage({ params }: PostPageProps) {
 
   const publishPath = post.urlPath.split("/").slice(0, -1).join("/");
 
-  return (
-    <article className="rounded-lg p-2 sm:p-7 max-w-3xl mx-auto">
-      {/* 마크다운 콘텐츠 */}
-      <div className="min-h-[250px] sm:min-h-[300px]">
-        <MarkdownRenderer
-          content={post.content}
-          publish={publishPath}
-          published={post.createdAt}
-          modified={post.modifiedAt}
-          tags={post.tags}
-        />
-      </div>
+  // 이전/다음 게시물 가져오기
+  const { prev, next } = await getAdjacentPosts(post);
 
-      {/* 홈으로 돌아가기 */}
-      <div className="mt-8 sm:mt-10 md:mt-12 pt-4 sm:pt-6 border-t">
-        <Link
-          href="/"
-          className="text-primary hover:underline inline-flex items-center text-sm sm:text-base"
-        >
-          <ArrowLeft className="mr-1 sm:mr-2 h-3 w-3 sm:h-4 sm:w-4" />
-          홈으로 돌아가기
-        </Link>
-      </div>
-    </article>
+  return (
+    <PostAnimation>
+      <PostContent
+        content={post.content}
+        publishPath={publishPath}
+        published={post.createdAt}
+        modified={post.modifiedAt}
+        tags={post.tags}
+        prevPost={prev}
+        nextPost={next}
+      />
+    </PostAnimation>
   );
 }