From 7a245efd137eaa7867946260aa333012e62c20fa Mon Sep 17 00:00:00 2001
From: sikkzz <sling0623@gmail.com>
Date: Wed, 22 May 2024 23:54:07 +0900
Subject: [PATCH] issue #291 refactor: comment text area style refactoring

---
 .../common/Comment/Comment.style.ts           | 31 +++++++++----------
 .../src/components/common/Comment/Comment.tsx |  2 +-
 .../common/Comment/Reply/ReplyInput.tsx       |  2 +-
 3 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/packages/waggle-service/src/components/common/Comment/Comment.style.ts b/packages/waggle-service/src/components/common/Comment/Comment.style.ts
index 9817f1ec..fd59afa1 100644
--- a/packages/waggle-service/src/components/common/Comment/Comment.style.ts
+++ b/packages/waggle-service/src/components/common/Comment/Comment.style.ts
@@ -12,22 +12,21 @@ export const textareaBoxStyle = css({
   width: "100%",
 });
 
-export const commentTextareaStyle = (width: number | string, height: number) =>
-  css({
-    border: `1px solid ${Theme.color.border}`,
-    borderRadius: "4px",
-    width,
-    height,
-    padding: "20px 74px 20px 20px",
-    fontSize: "16px",
-    fontWeight: 500,
-    outline: "none",
-    overflowWrap: "break-word",
-    wordBreak: "break-all",
-    whiteSpace: "pre-wrap",
-    resize: "none",
-    fontFamily: "Pretendard",
-  });
+export const commentTextareaStyle = css({
+  border: `1px solid ${Theme.color.border}`,
+  borderRadius: "4px",
+  width: "100%",
+  height: "112px",
+  padding: "20px 74px 20px 20px",
+  fontSize: "16px",
+  fontWeight: 500,
+  outline: "none",
+  overflowWrap: "break-word",
+  wordBreak: "break-all",
+  whiteSpace: "pre-wrap",
+  resize: "none",
+  fontFamily: "Pretendard",
+});
 
 export const commentCardBoxStyle = css({
   width: "100%",
diff --git a/packages/waggle-service/src/components/common/Comment/Comment.tsx b/packages/waggle-service/src/components/common/Comment/Comment.tsx
index b16c1e1f..5d3afcd3 100644
--- a/packages/waggle-service/src/components/common/Comment/Comment.tsx
+++ b/packages/waggle-service/src/components/common/Comment/Comment.tsx
@@ -44,7 +44,7 @@ const Comment = ({ boardId }: { boardId: number }) => {
       <Box css={textareaBoxStyle}>
         <textarea
           placeholder="인터넷은 우리가 함께 만들어가는 소중한 공간입니다. 댓글 작성 시 타인에 대한 배려와 책임을 담아주세요."
-          css={commentTextareaStyle("100%", 113)}
+          css={commentTextareaStyle}
           value={commentContent}
           onChange={(e) => handleCommentContent(e.target.value)}
           ref={commentTextAreaRef}
diff --git a/packages/waggle-service/src/components/common/Comment/Reply/ReplyInput.tsx b/packages/waggle-service/src/components/common/Comment/Reply/ReplyInput.tsx
index 18e5f363..4ed54060 100644
--- a/packages/waggle-service/src/components/common/Comment/Reply/ReplyInput.tsx
+++ b/packages/waggle-service/src/components/common/Comment/Reply/ReplyInput.tsx
@@ -24,7 +24,7 @@ const ReplyInput = ({
     <Box css={replyInputBoxStyle}>
       <textarea
         placeholder="인터넷은 우리가 함께 만들어가는 소중한 공간입니다. 댓글 작성 시 타인에 대한 배려와 책임을 담아주세요."
-        css={commentTextareaStyle("100%", 113)}
+        css={commentTextareaStyle}
         value={content}
         onChange={(e) => handleCommentContent(e.target.value)}
         ref={replyRef}