From fc1b0c77d7f64b8ff5b5065dbdadd139c4f0d405 Mon Sep 17 00:00:00 2001
From: CodyMan0 <hys83751952@gmail.com>
Date: Sat, 30 Mar 2024 20:16:47 +0900
Subject: [PATCH] =?UTF-8?q?:lipstick:=20=EB=A9=94=EC=9D=B8=20=ED=8E=98?=
 =?UTF-8?q?=EC=9D=B4=EC=A7=80=20UI=20=EB=B0=98=EC=98=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/test/_components/TestHomePage.tsx | 42 ++++++++++++++---------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/src/app/test/_components/TestHomePage.tsx b/src/app/test/_components/TestHomePage.tsx
index 836f86a..52e6a25 100644
--- a/src/app/test/_components/TestHomePage.tsx
+++ b/src/app/test/_components/TestHomePage.tsx
@@ -1,7 +1,4 @@
-import Image from 'next/image';
-
-import LogoImage from '@/assets/images/logo.png';
-import { default as WorryImage } from '@/assets/images/test-worry.png';
+import MainLogo from '@/assets/images/mainLogo.svg';
 import { Button } from '@/components/common/button';
 import { Input } from '@/components/common/input';
 import { Typography } from '@/components/common/typography';
@@ -37,28 +34,39 @@ const TestHomePage = () => {
         <Header.IconLink href="/mypage" icon="mypage" />
       </Header>
 
-      <main className="flex size-full flex-col items-center px-2xs">
-        <div className="flex h-full flex-col items-center justify-evenly">
-          <div className="flex flex-col items-center gap-4xs">
-            <Image src={LogoImage} width={150} height={91} alt="logo" priority />
-            <Typography type="title1">축의금 결정이 너무 어려웠나요?</Typography>
+      <main className="flex size-full flex-col items-center">
+        <div className="flex flex-col items-center justify-center py-sm">
+          <h1 className="text-[32px] font-semibold">축의금 얼마 내지?</h1>
+          <div className="h-md  rounded-md border-2 border-primary-700 text-center">
+            <div className="flex items-center justify-between gap-2 px-4xs text-[24px] font-bold leading-[145%] text-primary-700">
+              <span>₩</span>
+              <p>??,???</p>
+            </div>
           </div>
-
-          <div className="flex flex-col items-center gap-xs">
-            <Image src={WorryImage} width={275} alt="logo" priority />
+          <Typography type="title4" className="pt-4xs text-gray-500">
+            상대와의 친밀도 알아보고 축의금 결정해보세요
+          </Typography>
+        </div>
+        <section className=" flex w-full flex-1 flex-col items-center">
+          <MainLogo width="100%" height="70%" />
+          <div className="w-[70%]">
             <Input
               type="fit"
               placeholder=" 상대 이름을 입력해주세요"
-              className="text-center"
+              className="text-center placeholder:text-gray-1000"
+              bgcolor="lightGray"
               value={test.buddy}
               onChange={(e) => dispatch({ type: 'setBuddyName', value: e.target.value })}
               onKeyUp={handleOnKeyEnter}
             />
           </div>
-        </div>
-        <Button width="full" onClick={handleTestFormInvalid}>
-          테스트하고 축의금 알아보기
-        </Button>
+        </section>
+
+        <footer className="w-full px-2xs">
+          <Button width="full" onClick={handleTestFormInvalid}>
+            테스트하고 축의금 알아보기
+          </Button>
+        </footer>
       </main>
     </div>
   );