feat: 설명 컴포넌트 구현 (#10)

* feat: 설명 컴포넌트 구현

* refactor: 수정 사항 반영

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

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'