From ed3faa5bf926d0bee59b9b9fc045156619ec5995 Mon Sep 17 00:00:00 2001
From: hyoribogo <97094709+hyoribogo@users.noreply.github.com>
Date: Tue, 31 Oct 2023 16:04:56 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EC=84=A4=EB=AA=85=20=EC=BB=B4=ED=8F=AC?=
 =?UTF-8?q?=EB=84=8C=ED=8A=B8=20=EA=B5=AC=ED=98=84=20(#10)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: 설명 컴포넌트 구현

* refactor: 수정 사항 반영
---
 src/components/PageIntro/index.tsx | 28 ++++++++++++++++++++++++++++
 src/components/index.ts            |  1 +
 2 files changed, 29 insertions(+)
 create mode 100644 src/components/PageIntro/index.tsx

diff --git a/src/components/PageIntro/index.tsx b/src/components/PageIntro/index.tsx
new file mode 100644
index 00000000..0f1b9678
--- /dev/null
+++ b/src/components/PageIntro/index.tsx
@@ -0,0 +1,28 @@
+interface PageIntroProps {
+  imageSrc?: string
+  description: string
+  className?: string
+}
+
+const PageIntro = ({
+  imageSrc,
+  description,
+  className = '',
+}: PageIntroProps) => {
+  return (
+    <div
+      className={`flex items-center gap-x-8 whitespace-pre-line border-2 p-4 ${className}`}
+    >
+      {imageSrc && (
+        <img
+          className="max-w-20 max-h-20 object-cover"
+          src={imageSrc}
+          alt="페이지를 소개하는 npc 아이콘"
+        />
+      )}
+      <p className={`text-sm sm:text-base`}>{description}</p>
+    </div>
+  )
+}
+
+export default PageIntro
diff --git a/src/components/index.ts b/src/components/index.ts
index 151141c0..13818b7a 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -1,3 +1,4 @@
+export { default as PageIntro } from './PageIntro'
 export { default as Profile } from './Profile'
 export { default as UserList } from './UserList'
 export { default as PersonalAnswer } from './PersonalAnswer'