fix : timeline테스트 및 타페이지css수정 (#243)

prgrms-fe-devcourse · Nov 7, 2024 · d9f561d · d9f561d
1 parent 0ed8f86
commit d9f561d
Show file tree

Hide file tree

Showing 6 changed files with 17 additions and 7 deletions.
diff --git a/src/entities/dataSldier/DateSlider.styled.ts b/src/entities/dataSldier/DateSlider.styled.ts
@@ -10,7 +10,8 @@ export const MonthWeekSelectorWrapper = styled.div`
 export const ArrowButton = styled.button`
     background: none;
     border: none;
-    font-size: 24px;
+    font-size: 20px;
+    color: rgba(0, 0, 0, 0.3);
     cursor: pointer;
 
     &:focus {

diff --git a/src/features/chart/ui/EmotionChart.styled.ts b/src/features/chart/ui/EmotionChart.styled.ts
@@ -20,7 +20,11 @@ export const ChartButtonStlyed = styled.button`
     background-color: #ffffff;
     border: 1px solid rgba(0, 0, 0, 0.17);
     border-radius: 38px;
-    font-weight: bold;
+
+    &:hover {
+        cursor: pointer;
+        background-color: rgba(0, 0, 0, 0.04);
+    }
 `;
 
 export const ChartWrapper = styled.div<SkeletonProps>`

diff --git a/src/widgets/Mypage/Mypage.styled.ts b/src/widgets/Mypage/Mypage.styled.ts
@@ -2,6 +2,8 @@ import styled from 'styled-components';
 
 export const MypageSpan = styled.span`
     font-size: 16px;
+    display: inline-block;
+    padding: 1rem 0;
 `;
 
 export const ButtonStyled = styled.div`
@@ -10,6 +12,8 @@ export const ButtonStyled = styled.div`
 `;
 
 export const MypageStyled = styled.div`
-    width: 500px;
+    width: 90%;
+    max-width: 500px;
     margin: auto;
+    padding-bottom: 150px;
 `;
diff --git a/src/widgets/Mypage/Mypage.tsx b/src/widgets/Mypage/Mypage.tsx
@@ -42,7 +42,7 @@ const Mypage = () => {
             <InputForm
                 label="이름"
                 value={name}
-                width="500px"
+                width="100%"
                 height="52px"
                 onChange={setPhoneNumber}
                 placeholder="이름을 입력해주세요"
@@ -54,7 +54,7 @@ const Mypage = () => {
             <InputForm
                 label="핸드폰 번호"
                 value={phoneNumber}
-                width="500px"
+                width="100%"
                 height="52px"
                 onChange={setName}
                 placeholder="이름을 입력해주세요"
@@ -68,7 +68,7 @@ const Mypage = () => {
                 label="비밀번호"
                 isPassword
                 value={password}
-                width="500px"
+                width="100%"
                 height="52px"
                 onChange={setPassword}
                 placeholder="비밀번호 입력 (문자, 숫자, 특수문자 8~20자)"

diff --git a/src/widgets/Sign/Sign.styled.ts b/src/widgets/Sign/Sign.styled.ts
@@ -10,4 +10,5 @@ export const IdContainerStyled = styled.div`
 export const SignStyled = styled.div`
     width: 500px;
     margin: auto;
+    padding-bottom: 150px;
 `;
diff --git a/src/widgets/timeline-container/TimelineContainer.tsx b/src/widgets/timeline-container/TimelineContainer.tsx
@@ -36,7 +36,7 @@ const TimelineContainer: React.FC<TimelineContainerProps> = ({
         queryClient.resetQueries({
             queryKey: ['timeline', sort, email, ispublic]
         });
-    }, [sort, email, queryClient]);
+    }, [sort, email, queryClient, ispublic]);
 
     useEffect(() => {
         if (inView && hasNextPage && !isFetchingNextPage) {