Refactor/#162: 글쓰기 제목 제한 20글자에서 40글자로 변경 (#163)

* refactor: 아이디어 본문 제목을 20글자 -> 40글자로 변경 * design: 두 줄 제목 line-height 조정
ConceptBe · Jun 6, 2024 · 4e5d997 · 4e5d997
1 parent f65731c
commit 4e5d997
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 6 deletions.
diff --git a/src/pages/FeedDetail/FeedDetail.page.tsx b/src/pages/FeedDetail/FeedDetail.page.tsx
@@ -1,3 +1,4 @@
+import styled from '@emotion/styled';
 import { Badge, Divider, Header, Spacer, Text, TextDivider, Flex, Box } from 'concept-be-design-system';
 import { useNavigate, useParams } from 'react-router-dom';
 
@@ -73,9 +74,9 @@ const FeedDetailPage = () => {
               {branchList.join(' / ')}
             </Text>
             <Spacer size={8} />
-            <Text font="suit18sb" color="b4">
+            <LineHeightText font="suit18sb" color="b4">
               {title}
-            </Text>
+            </LineHeightText>
             <Spacer size={8} />
             <Flex alignItems="center">
               <Text font="suit12r" color="b9">
@@ -178,3 +179,7 @@ const FeedDetailPage = () => {
 };
 
 export default FeedDetailPage;
+
+const LineHeightText = styled(Text)`
+  line-height: 20px;
+`;
diff --git a/src/pages/Write/components/TitleAndIntroduceSection.tsx b/src/pages/Write/components/TitleAndIntroduceSection.tsx
@@ -15,7 +15,7 @@ type Props = {
 const TitleAndIntroduceSection = ({ title, introduce, onTitleChange, onIntroduceChange }: Props) => {
   const handleChangeTitle = (e: ChangeEvent<HTMLInputElement>) => {
     const newTitle = e.target.value;
-    if (newTitle.length > 20) return; // 제목 길이 제한
+    if (newTitle.length > 40) return; // 제목 길이 제한
 
     onTitleChange(newTitle);
   };
@@ -30,7 +30,7 @@ const TitleAndIntroduceSection = ({ title, introduce, onTitleChange, onIntroduce
   return (
     <>
       <HeaderInput
-        placeholder="제목을 입력해 주세요. (최대20자)"
+        placeholder="제목을 입력해 주세요. (최대 40자)"
         value={title}
         onChange={handleChangeTitle}
         autoFocus

diff --git a/src/pages/WriteEdit/components/TitleAndIntroduceSection.tsx b/src/pages/WriteEdit/components/TitleAndIntroduceSection.tsx
@@ -15,7 +15,7 @@ type Props = {
 const TitleAndIntroduceSection = ({ title, introduce, onTitleChange, onIntroduceChange }: Props) => {
   const handleChangeTitle = (e: ChangeEvent<HTMLInputElement>) => {
     const newTitle = e.target.value;
-    if (newTitle.length > 20) return; // 제목 길이 제한
+    if (newTitle.length > 40) return; // 제목 길이 제한
 
     onTitleChange(newTitle);
   };

diff --git a/src/pages/components/NewIdeaCard/compound/Content/Content.tsx b/src/pages/components/NewIdeaCard/compound/Content/Content.tsx
@@ -47,7 +47,7 @@ const Content = ({ onClickDelete }: Props) => {
           </Text>
           <Spacer size={7} />
 
-          <Text font="suit16sb">{title}</Text>
+          <LineHeightText font="suit16sb">{title}</LineHeightText>
         </Flex>
 
         {canEdit && (
@@ -97,3 +97,7 @@ const ContentText = styled.div`
 const TagWrapper = styled.div`
   padding: 0;
 `;
+
+const LineHeightText = styled(Text)`
+  line-height: 20px;
+`;