design: 댓글 디자인 수정

frontend/src/components/Article/FreeboardDetail/FreeDetailComments/FreeboardComment.module.css

@@ -3,9 +3,7 @@
   flex-direction: column;
   gap: 8px;
   width: 100%;
-  border: 1px solid var(--border-color);
+  padding: 12px 0;
-  border-radius: 16px;
-  padding: 12px 16px;
   box-sizing: border-box;
 }
 
@@ -43,6 +41,7 @@
   line-height: 1.4;
   margin: 0;
   color: var(--text-color);
+  word-break: break-word;
 }
 
 .input {

frontend/src/components/Article/FreeboardDetail/FreeboardDetail.jsx

@@ -56,18 +56,22 @@ export default function FreeboardDetail({ topic, title, author, content, onDelet
       <div>
         <p className={styles.content}>{content}</p>
       </div>
-      {comments &&
+
-        comments.map((comment) => (
+      {comments && (
-          <FreeboardComment
+        <div className={styles.commentWrapper}>
-            key={comment.id}
+          {comments.map((comment) => (
-            content={comment.content}
+            <FreeboardComment
-            author={comment.name}
+              key={comment.id}
-            commentId={comment.id}
+              content={comment.content}
-            isMine={comment.mine}
+              author={comment.name}
-            onDeleteSubmit={refetch}
+              commentId={comment.id}
-            onEditSubmit={refetch}
+              isMine={comment.mine}
-          />
+              onDeleteSubmit={refetch}
-        ))}
+              onEditSubmit={refetch}
+            />
+          ))}
+        </div>
+      )}
       <FreeboardCommentInput onCommentSubmit={handleCommentSubmit} />
     </div>
   );

frontend/src/components/Article/FreeboardDetail/FreeboardDetail.module.css

@@ -114,3 +114,11 @@
 .delete {
   color: var(--error-color);
 }
+
+.commentWrapper {
+  display: flex;
+  flex-direction: column;
+  border-top: 1px solid var(--border-color);
+  margin-top: 10px;
+  padding-top: 18px;
+}

frontend/src/components/Layout/MaxWidthLayout.module.css

@@ -19,6 +19,7 @@
   }
 
   & > main {
+    min-width: 0;
     width: 100%;
   }
 }