Merge: Fix -> Develop

홈페이지 로고 추가, login 페이지 수정, characterPage 수정
GDG-Hackathon-77ia · Nov 15, 2024 · 4fc1d5f · 4fc1d5f
2 parents d6269ff + 52bea42
commit 4fc1d5f
Show file tree

Hide file tree

Showing 11 changed files with 65 additions and 23 deletions.
diff --git a/src/apis/auth/auth.ts b/src/apis/auth/auth.ts
@@ -50,7 +50,7 @@ export const kakaoLoginCallback_kkia = async (code: string): Promise<{ accessTok
     const response = await axiosInstance.get<{ accessToken: string; refreshToken: string }>(
         "/api/auth/oauth/kakao/callback",
         {
-            baseURL: "https://dandani.site", // 이 요청에서만 baseURL 설정
+            baseURL: "https://kkia.backapi.site", // 이 요청에서만 baseURL 설정
             params: { code },
         },
     );

diff --git a/src/assets/logo/mainLogo.png b/src/assets/logo/mainLogo.png
diff --git a/src/components/PointButton/index.tsx b/src/components/PointButton/index.tsx
@@ -19,8 +19,8 @@ export const PointButton = (props: PointButtonProps) => {
 
     const pointList = {
         water: 10,
-        sun: 15,
-        nutrients: 20,
+        sun: 20,
+        nutrients: 40,
     };
 
     const actionList = {

diff --git a/src/pages/CharacterPage/index.style.ts b/src/pages/CharacterPage/index.style.ts
@@ -3,7 +3,7 @@ import styled from "@emotion/styled";
 import logoImg from "@/assets/logo/logo.png";
 
 export const Container = styled.div`
-    max-width: 440px;
+    max-width: 400px;
     height: 100vh;
     margin: 0 auto;
 
@@ -61,16 +61,18 @@ export const CharacterItem = styled.div`
     justify-content: center;
     align-items: center;
     gap: 20px;
-    
+
     & > *:first-child {
         position: absolute;
         top: -30px; /* 상단 텍스트 위치 고정 */
     }
-    
+
     & > *:last-child {
         position: absolute;
         bottom: -30px; /* 하단 텍스트 위치 고정 */
     }
+
+    padding: 20px;
 `;
 
 export const BarContainer = styled.div`
@@ -96,4 +98,4 @@ export const ButtonContainer = styled.div`
     display: flex;
     align-items: center;
     justify-content: space-between;
-`;
+`;
diff --git a/src/pages/CharacterPage/index.tsx b/src/pages/CharacterPage/index.tsx
@@ -42,17 +42,17 @@ export const CharacterPage = () => {
             <Styles.CharacterItem>
                 {level === 1 && (
                     <Text size="l" color="black" weight="bold">
-                        1단계 입니다
+                        앞으로 쑥쑥 자랄게요!
                     </Text>
                 )}
                 {level === 2 && (
                     <Text size="l" color="black" weight="bold">
-                        2단계 입니다
+                        점점 더 멋있어지고 있어요! ｡♥‿♥｡
                     </Text>
                 )}
                 {level === 3 && (
                     <Text size="l" color="black" weight="bold">
-                        3단계 입니다
+                        멋지게 자랐어요! •ᴗ•
                     </Text>
                 )}
                 <Temp width="300px" height="270px" level={level} />

diff --git a/src/pages/HomePage/index.style.ts b/src/pages/HomePage/index.style.ts
@@ -18,9 +18,8 @@ interface ContainerProps {
 
 // 애니메이션 스타일이 적용된 컨테이너
 export const Container = styled.div<ContainerProps>`
-    max-width: 400px;
-    height: 100vh;
-    max-height: 956px;
+    max-width: 440px;
+    height: min(100vh, 956px);
     margin: 0 auto;
 
     background-color: var(--color-primary);
@@ -35,3 +34,10 @@ export const Container = styled.div<ContainerProps>`
             animation: ${fadeOut} 1s ease forwards;
         `}
 `;
+
+export const LogoItem = styled.img`
+    width: 230px;
+    height: 205px;
+
+    border-radius: 15px;
+`;
diff --git a/src/pages/HomePage/index.tsx b/src/pages/HomePage/index.tsx
@@ -1,6 +1,9 @@
 // HomePage.tsx
 import React, { useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
+
+import mainLogoImg from "@/assets/logo/mainLogo.png";
+
 import * as Styles from "./index.style";
 
 export const HomePage: React.FC = () => {
@@ -25,7 +28,7 @@ export const HomePage: React.FC = () => {
 
     return (
         <Styles.Container fade={fade}>
-            <img src="" alt="LOGO" />
+            <Styles.LogoItem src={mainLogoImg} alt="LOGO" />
         </Styles.Container>
     );
-};
+};
diff --git a/src/pages/LoginPage/index.style.ts b/src/pages/LoginPage/index.style.ts
@@ -20,3 +20,8 @@ export const TextContainer = styled.div`
 
     gap: 20px;
 `;
+
+export const TextElement = styled.div`
+    display: flex;
+    align-items: center;
+`;
diff --git a/src/pages/LoginPage/index.tsx b/src/pages/LoginPage/index.tsx
@@ -6,16 +6,21 @@ import * as Styles from "./index.style";
 
 export const LoginPage = () => {
     const handleKakaoLogin = () => {
-        window.location.href = 'http://kkia.backapi.site:8080/api/auth/oauth/kakao';
-      };
+        window.location.href = "http://kkia.backapi.site:8080/api/auth/oauth/kakao";
+    };
     return (
         <Styles.Container>
             <Styles.TextContainer>
-                <Text size="xl" color="black" weight="bold">
-                    ___에 오신 것을 환영합니다
-                </Text>
+                <Styles.TextElement>
+                    <Text size="l" color="primary" weight="bold">
+                        "Dan Dan"
+                    </Text>
+                    <Text size="l" color="black" weight="bold">
+                        에 오신 것을 환영합니다
+                    </Text>
+                </Styles.TextElement>
                 <Text size="s" color="gray" weight="normal">
-                    로그인 후 ___ 서비스를 경험해보세요
+                    로그인 후 DanDan 서비스를 경험해보세요
                 </Text>
             </Styles.TextContainer>
             <Temp width="250px" height="220px" />

diff --git a/src/pages/RedirectPage/index.style.ts b/src/pages/RedirectPage/index.style.ts
@@ -0,0 +1,12 @@
+import styled from "@emotion/styled";
+
+export const Container = styled.div`
+    max-width: 400px;
+    height: min(100vh, 956px);
+    margin: 0 auto;
+
+    display: flex;
+    align-items: center;
+    justify-content: center;
+`;
+
diff --git a/src/pages/RedirectPage/index.tsx b/src/pages/RedirectPage/index.tsx
@@ -1,8 +1,11 @@
 import { useEffect } from "react";
 import { useNavigate } from "react-router-dom";
 
+import { Text } from "@/components/Text/index.tsx";
+
 import { kakaoLoginCallback_kkia } from "../../apis/auth/auth.ts";
 import { useAuthStore } from "../../store.ts";
+import * as Styles from "./index.style.ts";
 
 export const RedirectPage = () => {
     const navigate = useNavigate();
@@ -30,5 +33,11 @@ export const RedirectPage = () => {
         fetchData();
     }, [navigate, setTokens]);
 
-    return <div>카카오 로그인 중입니다…</div>;
-};
+    return (
+        <Styles.Container>
+            <Text size="l" weight="bold" color="black">
+                카카오 로그인 중입니다...
+            </Text>
+        </Styles.Container>
+    );
+};