Fix: 댓글 등록 버튼 만듦 #65

puppypawpaw · Oct 17, 2023 · 5998e04 · 5998e04
1 parent e8de94d
commit 5998e04
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 14 deletions.
diff --git a/components/ui/BoardCard/BoardCardPackage/CommentWrapper.tsx b/components/ui/BoardCard/BoardCardPackage/CommentWrapper.tsx
@@ -1,8 +1,8 @@
 import Image from 'next/image';
 import { useState } from 'react';
 import usePostComment from '@/hooks/mutations/usePostComment';
+import PaperPlaneIcon from '@/public/PaperPlaneTilt.svg';
 import FlexBox from '../../FlexBox';
-import Button from '../../Button';
 
 export function BoardCardCommentWrapper({
   children,
@@ -69,26 +69,28 @@ export function BoardCardCommentWrapper({
         )}
       </FlexBox>
       <FlexBox className="gap-[9px] w-full">
-        <Image
-          src="/Feed/desktop/like.svg"
-          alt="좋아요"
-          width={24}
-          height={24}
-        />
+        <button type="button">
+          <Image
+            src="/Feed/desktop/like.svg"
+            alt="좋아요"
+            width={24}
+            height={24}
+          />
+        </button>
         <input
           type="text"
           placeholder="댓글로 이웃과 소통해보세요!"
           className="border rounded-[10px] py-[16px] px-[20px] w-full body4 text-grey-400"
           value={commentText}
           onChange={(event) => setCommentText(event.target.value)}
         />
-        <Button
-          onClickAction={postNewComment}
-          disabled={isLoading}
-          variant="ghost"
-        >
-          {isLoading ? <p>...</p> : <span>⇧</span>}
-        </Button>
+        <button type="button" onClick={() => postNewComment}>
+          <PaperPlaneIcon
+            className={`w-8 h-8 ${
+              isLoading ? 'fill-grey-300' : 'fill-primary-300'
+            }`}
+          />
+        </button>
       </FlexBox>
     </FlexBox>
   );

diff --git a/components/ui/BoardCard/FeedBoardCard.tsx b/components/ui/BoardCard/FeedBoardCard.tsx
@@ -47,6 +47,7 @@ export default function FeedBoardCard({
         >
           <FlexBox
             direction="column"
+            justify="start"
             align="start"
             className="max-h-[82px] overflow-hidden"
           >