From 742d37164685295622bd2adc15bac34df323403f Mon Sep 17 00:00:00 2001
From: Dang <looks32@gmail.com>
Date: Tue, 17 Dec 2024 13:18:04 +0900
Subject: [PATCH] =?UTF-8?q?=EA=B2=8C=EC=8B=9C=ED=8C=90=20=EB=8C=93?=
 =?UTF-8?q?=EA=B8=80,=20=ED=94=84=EB=A1=9C=ED=95=84=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/board/BoardComment.vue |  2 +-
 src/components/board/BoardProfile.vue | 34 ++++++++++++++++++++++++---
 2 files changed, 32 insertions(+), 4 deletions(-)

diff --git a/src/components/board/BoardComment.vue b/src/components/board/BoardComment.vue
index 00b94ba..1045b60 100644
--- a/src/components/board/BoardComment.vue
+++ b/src/components/board/BoardComment.vue
@@ -21,7 +21,7 @@
             <BoardComentArea v-if="comment" />
         </li>
         <li>
-            <BoardProfile profileName=곤데리 :showDetail="false" :unknown="false"/>
+            <BoardProfile :showDetail="false" :unknown="false" :likeClicked="true" :dislikeClicked="true"/>
             <div class="mt-2">저도 궁금합니다.</div>
             <button type="button" class="btn btn-text-primary" @click="toggleComment">답변달기</button>
             <BoardComentArea v-if="comment" />
diff --git a/src/components/board/BoardProfile.vue b/src/components/board/BoardProfile.vue
index 45abf76..c69a22d 100644
--- a/src/components/board/BoardProfile.vue
+++ b/src/components/board/BoardProfile.vue
@@ -32,10 +32,10 @@
                 </button>
             </template>
             <template v-else>
-                <button class="btn btn-label-primary btn-icon">
+                <button class="btn btn-label-primary btn-icon" :class=" likeClicked ? 'clicked' : '' ">
                     <i class="fa-regular fa-thumbs-up"></i> <span class="num">1</span>
                 </button>
-                <button class="btn btn-label-danger btn-icon">
+                <button class="btn btn-label-danger btn-icon" :class=" dislikeClicked ? 'clicked' : '' ">
                     <i class="fa-regular fa-thumbs-down"></i> <span class="num">1</span>
                 </button>
             </template>
@@ -47,7 +47,7 @@
 defineProps({
     profileName : {
         type: String,
-        required: true,
+        default: '익명',
     },
     unknown : {
         type: Boolean,
@@ -57,7 +57,17 @@ defineProps({
         type: Boolean,
         default: true,
     },
+    likeClicked : {
+        type : Boolean,
+        default : false,
+    },
+    dislikeClicked : {
+        type : Boolean,
+        default : false,
+    }
 });
+
+
 </script>
 
 <style scoped>
@@ -72,4 +82,22 @@ defineProps({
     .num {
         margin-left: 5px;
     }
+
+    .btn-label-danger.clicked {
+        background-color: #e6381a;
+    }
+
+    .btn-label-danger.clicked i,
+    .btn-label-danger.clicked span {
+        color: #fff;
+    }
+
+    .btn-label-primary.clicked {
+        background-color: #5f61e6;
+    }
+
+    .btn-label-primary.clicked i,
+    .btn-label-primary.clicked span  {
+        color : #fff;
+    }
 </style>
\ No newline at end of file