diff --git a/src/pages/HomePage.js b/src/pages/HomePage.js
new file mode 100644
index 0000000..bf92db7
--- /dev/null
+++ b/src/pages/HomePage.js
@@ -0,0 +1,56 @@
+import React from "react";
+import { useNavigate } from "react-router-dom";
+import Logo from "../components/Logo"; // 올바른 경로
+
+const HomePage = () => {
+ const navigate = useNavigate();
+
+ return (
+
+
+
+
+
+
+
+
+
+ );
+};
+
+const styles = {
+ container: {
+ backgroundColor: "#F8EAD2",
+ height: "100vh",
+ display: "flex",
+ flexDirection: "column",
+ justifyContent: "center", // 수직 가운데
+ alignItems: "center", // 수평 가운데
+ padding: "20px",
+ },
+ logoWrapper: {
+ marginBottom: "40px",
+ },
+ buttonContainer: {
+ display: "flex",
+ gap: "30px",
+ flexDirection: "row",
+ justifyContent: "center",
+ },
+ button: {
+ width: "140px",
+ height: "100px",
+ fontSize: "16px",
+ border: "1px solid #555",
+ borderRadius: "20px",
+ backgroundColor: "#FFF",
+ cursor: "pointer",
+ boxShadow: "2px 2px 5px rgba(0,0,0,0.2)",
+ },
+};
+
+export default HomePage;
\ No newline at end of file
diff --git a/src/pages/ReportsPage.js b/src/pages/ReportsPage.js
new file mode 100644
index 0000000..2f1f916
--- /dev/null
+++ b/src/pages/ReportsPage.js
@@ -0,0 +1,80 @@
+import React from "react";
+import Logo from "../components/Logo";
+
+const ReportsPage = () => {
+ return (
+
+
+
+
몇월 몇주차 리포트입니다.
+
+
+
+
+
+
감정 분석 결과 이미지가 여기에 표시됩니다.
+
+
+ );
+};
+
+const styles = {
+ container: {
+ backgroundColor: "#F8EAD2",
+ minHeight: "100vh",
+ padding: "30px",
+ display: "flex",
+ flexDirection: "column",
+ alignItems: "center",
+ },
+ header: {
+ width: "100%",
+ maxWidth: "500px",
+ display: "flex",
+ justifyContent: "space-between",
+ alignItems: "center",
+ marginBottom: "20px",
+ },
+ title: {
+ fontSize: "18px",
+ fontWeight: "bold",
+ color: "#1C2C5B",
+ },
+ reportBox: {
+ width: "100%",
+ maxWidth: "500px",
+ backgroundColor: "#F8EAD2",
+ border: "1px solid #888",
+ borderRadius: "12px",
+ padding: "20px",
+ marginBottom: "30px",
+ maxHeight: "250px",
+ overflowY: "auto",
+ boxSizing: "border-box",
+ },
+ reportText: {
+ fontSize: "15px",
+ color: "#444",
+ },
+ imagePlaceholder: {
+ width: "100%",
+ maxWidth: "500px",
+ height: "300px",
+ backgroundColor: "#FFF",
+ border: "1px solid #ccc",
+ borderRadius: "10px",
+ display: "flex",
+ justifyContent: "center",
+ alignItems: "center",
+ },
+ placeholderText: {
+ color: "#999",
+ fontStyle: "italic",
+ },
+};
+
+export default ReportsPage;
\ No newline at end of file
diff --git a/src/pages/VoiceTrainingPage.js b/src/pages/VoiceTrainingPage.js
index 5a40422..3eefa4f 100644
--- a/src/pages/VoiceTrainingPage.js
+++ b/src/pages/VoiceTrainingPage.js
@@ -14,9 +14,13 @@ const VoiceTrainingPage = () => {

-
- 안촉촉한 초코칩 나라에 살던 안촉촉한 초코칩이 초초초초초초콬초코촠칩.. 아직 미정이에유.. 텍스트 분석하기 좋은 글들을 넣어봅시다.
-
+
+
오늘 하루는 어땠나요? 기분이 괜찮으신가요?
+
밖에 나가서 산책도 하셨어요?
+
식사는 잘 챙기셨는지 궁금합니다.
+
약은 꼭 챙겨드셔야 해요. 잊지 마세요.
+
목소리를 들으니 안심이 됩니다.
+
@@ -48,25 +52,25 @@ const styles = {
},
memoContainer: {
position: "relative",
- width: "250px",
- height: "200px",
+ width: "300px", // 너비 약간 키움
+ padding: "20px", // 내부 여백
+ backgroundImage: "url('/images/memo_background.png')",
+ backgroundSize: "cover",
+ backgroundRepeat: "no-repeat",
marginBottom: "20px",
- },
- memoImage: {
- width : "100%",
- height : "100%",
- objectFit : "cover",
- },
- memoText: {
- position: "absolute",
- top: "20px",
- left: "20px",
- right: "20px",
+ borderRadius: "10px",
+ },
+
+ memoImage: {
+ display: "none", // 안 써도 됨 (backgroundImage로 대체했기 때문)
+ },
+
+ memoText: {
fontSize: "14px",
- textAlign : "center",
- lineHeight : "1.5",
- fontWeight : "bold",
- },
+ lineHeight: "1.6",
+ fontWeight: "bold",
+ textAlign: "left",
+ },
nextButton: {
backgroundColor : "#DABEC9",
border: "none",