From aeb8dedf7821b6662a0411b31546f02b931f3067 Mon Sep 17 00:00:00 2001 From: chominju Date: Sat, 16 Nov 2024 06:19:11 +0900 Subject: [PATCH 1/2] =?UTF-8?q?fix:=20diary=20=EC=A7=88=EB=AC=B8=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/WriteDiaryPage/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/WriteDiaryPage/index.tsx b/src/pages/WriteDiaryPage/index.tsx index 1b67d96..582cf47 100644 --- a/src/pages/WriteDiaryPage/index.tsx +++ b/src/pages/WriteDiaryPage/index.tsx @@ -57,14 +57,14 @@ export const WriteDiaryPage = () => { - 2. 오늘의 감정은 어땠나요? + 2. 당신의 감정을 솔직하게 적어주세요. - 3. 오늘의 하루를 한 줄로 표현해보세요. + 3. 추가적으로 남기고 싶은 말이 있나요? From a08d5876d23b8a04de881c764426eec113333085 Mon Sep 17 00:00:00 2001 From: chominju Date: Sat, 16 Nov 2024 06:49:23 +0900 Subject: [PATCH 2/2] =?UTF-8?q?feat:=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/pages/CharacterPage/index.style.ts | 6 ++--- src/pages/CharacterPage/index.tsx | 10 +++++++- src/pages/MainPage/index.style.ts | 4 ++-- src/pages/MemoPage/index.style.ts | 26 +++++++++++++++++---- src/pages/MemoPage/index.tsx | 32 ++++++++++++++++---------- 5 files changed, 55 insertions(+), 23 deletions(-) diff --git a/src/pages/CharacterPage/index.style.ts b/src/pages/CharacterPage/index.style.ts index dbaf487..4fc90b7 100644 --- a/src/pages/CharacterPage/index.style.ts +++ b/src/pages/CharacterPage/index.style.ts @@ -3,13 +3,14 @@ import styled from "@emotion/styled"; import logoImg from "@/assets/logo/logo.png"; export const Container = styled.div` - max-width: 400px; + max-width: 440px; height: 100vh; margin: 0 auto; + padding: 20px; + display: flex; flex-direction: column; - justify-content: center; gap: 60px; `; @@ -58,7 +59,6 @@ export const CharacterItem = styled.div` display: flex; flex-direction: column; - justify-content: center; align-items: center; gap: 20px; diff --git a/src/pages/CharacterPage/index.tsx b/src/pages/CharacterPage/index.tsx index 3cd72ea..3b0baac 100644 --- a/src/pages/CharacterPage/index.tsx +++ b/src/pages/CharacterPage/index.tsx @@ -20,6 +20,14 @@ export const CharacterPage = () => { }; const { name, level, experience, refetch } = useGetCharacter(); + let experience_scale = 0; + if (level === 1) { + experience_scale = Math.floor(experience / 1.5); + } else if (level === 2) { + experience_scale = Math.floor(experience / 3); + } else { + experience_scale = Math.floor(experience / 4.5); + } const { point, pointRefetch } = useGetPoint(); const { upgradeExperience } = useUpGradeExperience(); @@ -62,7 +70,7 @@ export const CharacterPage = () => { - + 보유 포인트: {point} point diff --git a/src/pages/MainPage/index.style.ts b/src/pages/MainPage/index.style.ts index 6a9c29b..8664f5b 100644 --- a/src/pages/MainPage/index.style.ts +++ b/src/pages/MainPage/index.style.ts @@ -3,13 +3,13 @@ import styled from "@emotion/styled"; import logoImg from "@/assets/logo/logo.png"; export const Container = styled.div` - max-width: 400px; + max-width: 440px; height: 100vh; margin: 0 auto; + padding: 20px; display: flex; flex-direction: column; - justify-content: center; align-items: center; gap: 20px; diff --git a/src/pages/MemoPage/index.style.ts b/src/pages/MemoPage/index.style.ts index 1d8b702..8e46d5e 100644 --- a/src/pages/MemoPage/index.style.ts +++ b/src/pages/MemoPage/index.style.ts @@ -80,7 +80,8 @@ export const DateItem = styled.div<{ isSelected: boolean; isToday: boolean }>` cursor: pointer; font-size: 16px; color: ${({ isSelected }) => (isSelected ? "#ffffff" : "#333")}; - background-color: ${({ isSelected, isToday }) => (isSelected ? "var(--color-primary)" : isToday ? "#e0e0e0" : "transparent")}; + background-color: ${({ isSelected, isToday }) => + isSelected ? "var(--color-primary)" : isToday ? "#e0e0e0" : "transparent"}; border-radius: 20px; padding: 5px 10px; min-width: 60px; @@ -97,6 +98,10 @@ export const SelectedDate = styled.div` width: 100%; margin-top: 20px; text-align: left; + + display: flex; + flex-direction: column; + gap: 20px; `; export const DayCounter = styled.div` @@ -120,8 +125,8 @@ export const MemosContainer = styled.div` `; export const MemoItem = styled.div` - padding: 10px; - border-radius: 8px; + padding: 20px; + border-radius: 20px; background-color: #e0e0e0; font-size: 14px; line-height: 1.4; @@ -193,13 +198,24 @@ export const InputContainer = styled.textarea` height: 100px; padding: 10px; font-size: 16px; - border-radius: 4px; + border-radius: 15px; border: 1px solid #ccc; resize: none; + + &:focus { + outline: none; + } `; export const ButtonContainer = styled.div` display: flex; justify-content: space-between; gap: 10px; -`; \ No newline at end of file +`; + +export const ContentContainer = styled.div` + width: 100%; + display: flex; + flex-direction: column; + padding: 20px; +`; diff --git a/src/pages/MemoPage/index.tsx b/src/pages/MemoPage/index.tsx index d593cf7..d049c87 100644 --- a/src/pages/MemoPage/index.tsx +++ b/src/pages/MemoPage/index.tsx @@ -1,6 +1,8 @@ import { useState, useRef, useCallback, useEffect } from "react"; import { useNavigate } from "react-router-dom"; +import { Text } from "@/components/Text"; + import { Button } from "../../components/Button"; import { PageBar } from "../../components/PageBar"; import * as Styles from "./index.style"; @@ -148,18 +150,24 @@ export const MemoPage = (): JSX.Element => { - - DAY 1 - 메모 - - - - {memos - .filter((memo) => memo.date === selectedDate) - .map((memo, index) => ( - {memo.content} - ))} - + + + + DAY + + + 메모 + + + + + {memos + .filter((memo) => memo.date === selectedDate) + .map((memo, index) => ( + {memo.content} + ))} + + {/* 오늘 날짜인 경우에만 추가 버튼 표시 */} {selectedDate === today && (