✨ 게시글 본문 이미지 줌 및 코드 복사 기능 추가

- 이미지 클릭 시 모달로 확대
- 코드 블록에 복사 버튼 통합
- 호버 시 시각적 피드백 추가

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: vcz-Chan

src/components/PostDetail/Body.tsx

@@ -2,17 +2,47 @@
 
 import Markdown from '@uiw/react-markdown-preview';
 import rehypeHighlight from 'rehype-highlight';
+import { useState } from 'react';
+import ImageZoomModal from '@/components/Common/ImageZoomModal';
+import CodeBlock from '@/components/Common/CodeBlock';
 
 export function PostDetailBody({ content }: { content: string }) {
+  const [zoomedImage, setZoomedImage] = useState<{ src: string; alt: string } | null>(null);
+
   return (
-    <div data-color-mode="light" className="prose prose-sm sm:prose-base max-w-none md:p-6 font-sans">
-      <Markdown
-        source={content}
-        rehypePlugins={[[rehypeHighlight, { detect: true }]]}
-        components={{
-          img: (props) => <img {...props} style={{ maxWidth: '100%' }} />,
-        }}
+    <>
+      <div data-color-mode="light" className="prose prose-sm sm:prose-base max-w-none md:p-6 font-sans">
+        <Markdown
+          source={content}
+          rehypePlugins={[[rehypeHighlight, { detect: true }]]}
+          components={{
+            img: (props) => (
+              <img
+                {...props}
+                style={{ maxWidth: '100%', cursor: 'zoom-in' }}
+                onClick={() => setZoomedImage({
+                  src: typeof props.src === 'string' ? props.src : '',
+                  alt: props.alt || ''
+                })}
+                className="rounded-lg hover:opacity-90 transition-opacity"
+                alt={props.alt || ''}
+              />
+            ),
+            pre: (props) => (
+              <CodeBlock className={props.className}>
+                {props.children}
+              </CodeBlock>
+            ),
+          }}
+        />
+      </div>
+
+      <ImageZoomModal
+        isOpen={!!zoomedImage}
+        onClose={() => setZoomedImage(null)}
+        imageSrc={zoomedImage?.src || ''}
+        imageAlt={zoomedImage?.alt}
       />
-    </div>
+    </>
   );
 }