[Fix/BAR-260] EditInput 초기 rows 값 수정

src/components/Card/style.css.ts

@@ -61,15 +61,15 @@ export const header = style([
     display: 'flex',
     gap: '8px',
     color: COLORS['Grey/400'],
-    wordBreak: 'keep-all',
+    wordBreak: 'break-all',
   },
 ]);
 
 export const body = style([
   sprinkles({ typography: '15/Body/Regular' }),
   {
     whiteSpace: 'pre-wrap',
-    wordBreak: 'keep-all',
+    wordBreak: 'break-all',
   },
 ]);
 

src/components/Modal/modals/EditFolder.tsx

@@ -89,8 +89,8 @@ const EditFolder = () => {
           취소
         </Button>
         <Button
-          className={clsx(styles.button, !value && styles.buttonDisabled)}
-          disabled={!value}
+          className={styles.button}
+          disabled={!value || value === folderName}
           style={assignInlineVars({
             [styles.buttonColor]: COLORS['Grey/White'],
             [styles.buttonBackgroundColor]: COLORS['Blue/Default'],

src/components/Modal/modals/MakeFolder.tsx

@@ -22,7 +22,6 @@ const MakeFolder = () => {
   const { mutate } = usePostMemoFolders();
 
   const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
-    setErrorMessage('');
     setValue(e.target.value);
   };
 
@@ -85,7 +84,7 @@ const MakeFolder = () => {
           취소
         </Button>
         <Button
-          className={clsx(styles.button, !value && styles.buttonDisabled)}
+          className={styles.button}
           disabled={!value}
           style={assignInlineVars({
             [styles.buttonColor]: COLORS['Grey/White'],

src/components/Modal/style.css.ts

@@ -81,22 +81,23 @@ export const button = style([
     backgroundColor: buttonBackgroundColor,
     padding: '16px 40px',
     borderRadius: '8px',
+
     selectors: {
       '& + &': {
         marginLeft: '8px',
       },
     },
+
+    ':disabled': {
+      opacity: '0.5',
+    },
   },
 ]);
 
 export const buttonWrapper = style({
   marginTop: '24px',
 });
 
-export const buttonDisabled = style({
-  opacity: '0.5',
-});
-
 export const helloImage = style({
   textAlign: 'center',
 });

src/components/Tooltip/style.css.ts

@@ -35,6 +35,7 @@ export const content = recipe({
     hasArrow: {
       false: {
         padding: '8px 12px',
+        margin: '4px 0',
       },
       true: {
         padding: '16px',
@@ -57,24 +58,22 @@ export const topArrow = style({
   marginTop: '13px',
 
   '::before': {
-    top: '-11.5px',
+    top: '-12px',
     borderBottomColor: COLORS['Dim/70'],
   },
 });
 
 export const bottomArrow = style({
-  marginBottom: '8px',
-
   '::before': {
-    bottom: '-11px',
+    bottom: '-12px',
     borderTopColor: COLORS['Dim/70'],
   },
 });
 
 export const minimalTooltipMargin = style({
-  marginTop: '-8px',
+  marginTop: '-20px',
 });
 
 export const highlightTooltipMargin = style({
-  marginTop: '-36px',
+  marginTop: '-46px',
 });

src/domain/landing/style.css.ts

@@ -91,7 +91,7 @@ export const rightText = style([
     display: 'inline-block',
     width: '270px',
     color: COLORS['Grey/800'],
-    wordBreak: 'keep-all',
+    wordBreak: 'break-all',
   },
 ]);
 

src/domain/끄적이는/components/EditInput.tsx

@@ -14,7 +14,7 @@ const EditInput = ({ inputProps }: EditInputProps) => {
     row: number;
     lineBreak: Record<number, boolean>;
   }>({
-    row: 1,
+    row: inputProps.value.split(/\r\n|\r|\n/).length,
     lineBreak: {},
   });
 

src/domain/끄적이는/components/editInput.css.ts

@@ -16,10 +16,10 @@ export const editInput = style([
   }),
   {
     width: '100%',
+    height: '100%',
     marginBottom: '8px',
     resize: 'none',
     overflowWrap: 'break-word',
-    maxHeight: '217px',
   },
 ]);