From e345a9c80ea12f9f51889df258c9c65337d8642d Mon Sep 17 00:00:00 2001 From: Buyeon Hwang <arpa1705@gmail.com> Date: Wed, 28 Aug 2024 21:05:50 +0900 Subject: [PATCH] =?UTF-8?q?feat:=20=EA=B2=B0=EA=B3=BC=EB=B3=B4=EA=B8=B0=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EA=B0=9C=EB=B0=9C=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/Router.tsx | 2 ++ src/pages/ResultPage.styled.ts | 14 ++++++++++++++ src/pages/ResultPage.tsx | 21 +++++++++++++++++++++ 3 files changed, 37 insertions(+) create mode 100644 src/pages/ResultPage.styled.ts create mode 100644 src/pages/ResultPage.tsx diff --git a/src/Router.tsx b/src/Router.tsx index 7aca3dc..01b07c5 100644 --- a/src/Router.tsx +++ b/src/Router.tsx @@ -2,12 +2,14 @@ import { Route, Routes } from "react-router-dom"; import { RootLayout } from "./components/layout/RootLayout"; import HomePage from "./pages/HomePage"; +import ResultPage from "./pages/ResultPage"; export const Router = () => { return ( <Routes> <Route path="/" element={<RootLayout />}> <Route index element={<HomePage />}></Route> + <Route path="/result" element={<ResultPage />}></Route> </Route> </Routes> ); diff --git a/src/pages/ResultPage.styled.ts b/src/pages/ResultPage.styled.ts new file mode 100644 index 0000000..7794b02 --- /dev/null +++ b/src/pages/ResultPage.styled.ts @@ -0,0 +1,14 @@ +import styled from "@emotion/styled"; + +export const TitleContainer = styled.div` + display: flex; + flex-direction: column; + gap: 1rem; +`; + +export const Line = styled.hr` + width: 100%; + margin: 1.25rem 0; + height: 1px; + border: 1px solid #e0e0e0; +`; diff --git a/src/pages/ResultPage.tsx b/src/pages/ResultPage.tsx new file mode 100644 index 0000000..0316ec8 --- /dev/null +++ b/src/pages/ResultPage.tsx @@ -0,0 +1,21 @@ +import TopBar from "@/components/layout/TopBar"; +import { Text } from "@/components/typography"; + +import { Line, TitleContainer } from "./ResultPage.styled"; + +export default function ResultPage() { + return ( + <> + <TopBar title="결과 보기" /> + <TitleContainer> + <Text size="s" color="gray"> + OOO님의 동BTI는... + </Text> + <Text size="xl" color="primary" weight="bold"> + 무대를 좋아하는 연주가형 + </Text> + </TitleContainer> + <Line /> + </> + ); +}