Merge pull request #141 from codeit-sprint-part3-6team/#136_1차-테스트-이슈-수정

#136 1차 테스트 이슈 수정

Author: hwiiron

src/components/common/button/NavButton.module.css

@@ -9,8 +9,6 @@
   background: none;
   padding: 0 16px;
 
-  font-size: 16px;
-  font-weight: 500;
   color: var(--gray);
 
   cursor: pointer;

src/components/common/checkbox/CheckBox.module.css

@@ -3,9 +3,7 @@
 }
 
 .text {
-  font-size: 16px;
   font-weight: 400;
-  color: var(--black-medium);
   cursor: pointer;
 }
 

src/components/common/input/auth-input/AuthInput.module.css

@@ -3,9 +3,7 @@
 }
 
 .title {
-  font-size: 16px;
   font-weight: 400;
-  color: var(--black-medium);
   cursor: pointer;
 }
 
@@ -22,7 +20,6 @@
   border-radius: 8px;
   width: 100%;
   height: 50px;
-  font-size: 16px;
   font-weight: 400;
 }
 

src/components/common/modal/auth/AuthModal.module.css

@@ -9,8 +9,6 @@
 
 .message {
   font-size: 20px;
-  font-weight: 500;
-  color: var(--black-medium);
   margin-bottom: 32px;
 }
 
@@ -20,7 +18,6 @@
   }
 
   .message {
-    font-size: 16px;
     margin-bottom: 32px;
   }
 }

src/components/common/modal/delete-cards/DeleteCardsModal.module.css

@@ -20,7 +20,6 @@
   }
 
   .message {
-    font-size: 16px;
     margin-bottom: 32px;
   }
 }

src/components/common/navbar/Navbar.module.css

@@ -8,44 +8,61 @@
   border-bottom: 1px solid var(--gray-medium);
   background-color: var(--white);
   padding: 0 80px 0 40px;
-  margin-left: 280px;
+  margin-left: 300px;
 }
 
 .title {
+  position: relative;
+
+  padding-right: 28px;
+  margin-right: 40px;
+  flex-shrink: 1;
+
   font-size: 20px;
   font-weight: 700;
   color: var(--black-medium);
+
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .title.createdByMe::after {
   content: '';
 
+  position: absolute;
+  top: 0;
+  right: 0;
+
   display: inline-block;
 
   width: 20px;
   height: 17px;
 
   background-image: url('/ic/ic_crown.svg');
   background-size: 100%;
-  margin-left: 8px;
 }
 
 .right-nav {
   display: flex;
+  flex-shrink: 0;
 }
 
 .left-section {
   position: relative;
 
   display: flex;
   align-items: center;
+  flex-shrink: 0;
 
   margin-right: 72px;
 }
 
 .left-section::before {
   content: '';
 
+  flex-shrink: 0;
+
   position: absolute;
   top: 0;
   right: -36px;
@@ -56,6 +73,10 @@
   background-color: var(--gray-medium);
 }
 
+.left-section button {
+  flex-shrink: 0;
+}
+
 .dropdown div > ul {
   top: 50px;
   right: -10px;

src/components/common/navbar/Navbar.tsx

@@ -64,19 +64,6 @@ function Navbar() {
     }
   }, [isModalOpen, alertMessage]);
 
-  const renderTitle = () => {
-    if (!isMyPage) return <h3 className={styles.title}>계정관리</h3>;
-    if (!isMyDashboard) return <h3 className={styles.title}>내 대시보드</h3>;
-
-    return (
-      <h3
-        className={`${styles.title} ${dashboardData?.createdByMe && `${styles.createdByMe}`}`}
-      >
-        {dashboardData?.title}
-      </h3>
-    );
-  };
-
   const handleDropdownClick = (value: string) => {
     if (value === 'logout') {
       localStorage.removeItem('accessToken');
@@ -112,14 +99,31 @@ function Navbar() {
     }
   };
 
+  if (isMyDashboard && isMyPage && !dashboardData) {
+    return;
+  }
+
+  const renderTitle = () => {
+    if (!isMyPage) return <h3 className={styles.title}>계정관리</h3>;
+    if (!isMyDashboard) return <h3 className={styles.title}>내 대시보드</h3>;
+
+    return (
+      <h3
+        className={`${styles.title} ${dashboardData?.createdByMe && `${styles.createdByMe}`}`}
+      >
+        {dashboardData?.title}
+      </h3>
+    );
+  };
+
   return (
     <div className={styles.navbar}>
       {renderTitle()}
 
       <div className={styles['right-nav']}>
         {isMyDashboard && isMyPage && (
           <div className={styles['left-section']}>
-            {isEdit && (
+            {isEdit && dashboardData.createdByMe && (
               <NavButton
                 btnType="management"
                 buttonName="관리"

src/components/common/userprofile/UserProfile.module.css

@@ -4,11 +4,15 @@
 }
 
 .user-img {
-  border-radius: 100%;
+  position: relative;
+
+  flex-shrink: 0;
+
   width: 38px;
   height: 38px;
   overflow: hidden;
-  position: relative;
+
+  border-radius: 100%;
 }
 
 .user-img > div {
@@ -20,18 +24,15 @@
 .user-img svg {
   width: 100%;
   height: 100%;
+
   object-fit: cover;
 }
 
 .user-nickname {
-  font-size: 16px;
-  font-weight: 400;
-  color: #333236;
+  flex-shrink: 0;
   margin-left: 12px;
-}
 
-.header .user-nickname {
-  font-weight: 500;
+  font-weight: 400;
 }
 
 .dashboard-detail .user-img {
@@ -60,8 +61,9 @@
   }
 
   .user-nickname {
-    font-size: 14px;
     margin-left: 8px;
+
+    font-size: 14px;
   }
 
   .header .user-nickname {

src/components/product/auth/SigninForm.tsx

@@ -48,7 +48,7 @@ function SigninForm() {
 
     setValues((prevValues) => ({
       ...prevValues,
-      [name]: value,
+      [name]: value.replace(/\s/g, ''),
     }));
   };
 

src/components/product/auth/SignupForm.tsx

@@ -50,7 +50,7 @@ function SignupForm() {
 
     setValues((prevValues) => ({
       ...prevValues,
-      [name]: type === 'checkbox' ? checked : value,
+      [name]: type === 'checkbox' ? checked : value.replace(/\s/g, ''),
     }));
   };