From 72f7c3a0fe83f2488df0c2fa5c602bbdeedb333a Mon Sep 17 00:00:00 2001
From: Dang <looks32@gmail.com>
Date: Mon, 16 Dec 2024 15:08:22 +0900
Subject: [PATCH] 1

---
 src/components/Comment.vue    | 17 +++++++++++++++++
 src/components/Profile.vue    | 29 +++++++++++++++++++++++++++++
 src/views/board/BoardView.vue |  4 +++-
 3 files changed, 49 insertions(+), 1 deletion(-)
 create mode 100644 src/components/Comment.vue
 create mode 100644 src/components/Profile.vue

diff --git a/src/components/Comment.vue b/src/components/Comment.vue
new file mode 100644
index 0000000..1eddb28
--- /dev/null
+++ b/src/components/Comment.vue
@@ -0,0 +1,17 @@
+<template>
+    <div>
+        <Profile/>
+        
+        <div>페이지네이션</div>
+    </div>
+</template>
+
+<script setup>
+
+import Profile from './Profile.vue';
+
+</script>
+
+<style lang="scss" scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/components/Profile.vue b/src/components/Profile.vue
new file mode 100644
index 0000000..aa4bb51
--- /dev/null
+++ b/src/components/Profile.vue
@@ -0,0 +1,29 @@
+<template>
+    <div class="d-flex align-items-center">
+        <div class="d-flex align-items-center">
+            <div class="avatar me-2">
+                <img src="/img/avatars/2.png" alt="Avatar" class="rounded-circle">
+            </div>
+            <div class="me-2">
+                <h6 class="mb-0">만드레</h6>
+                <small>2024.12.10 10:46</small>
+            </div>
+        </div>
+        <div class="ms-auto">
+            <button class="btn btn-label-primary btn-icon">
+                <i class="bx bx-user-check bx-md"></i>
+            </button>
+            <button class="btn btn-label-primary btn-icon">
+                <i class="bx bx-user-check bx-md"></i>
+            </button>
+        </div>
+    </div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/views/board/BoardView.vue b/src/views/board/BoardView.vue
index ab92960..8095e71 100644
--- a/src/views/board/BoardView.vue
+++ b/src/views/board/BoardView.vue
@@ -1,13 +1,15 @@
 <template>
     <div class="container-xxl flex-grow-1 container-p-y">
         <div class="row">
-            board213123
+            <Comment/>
         </div>
     </div>
 </template>
 
 <script setup>
 
+import Comment from '@/components/Comment.vue';
+
 </script>
 
 <style>