Merge branch 'JangDH' into develope

frontend/src/App.tsx

 import React from "react";
+import RootPage from "./Pages/RootPage";
 import HomePage from "./Pages/HomePage";
 import LoginPage from "./Pages/LoginPage";
 import SignUpPage from "./Pages/SignUpPage";
@@ -9,7 +10,8 @@ export const App = () => {
   return (
     <BrowserRouter>
       <Routes>
-        <Route path="/" element={<HomePage />}>
+        <Route path="/" element={<RootPage />}>
+          <Route index element={<HomePage/>}/>
           <Route path="login" element={<LoginPage />} />
           <Route path="signup" element={<SignUpPage />} />
         </Route>

frontend/src/Pages/HomePage.tsx

 import React from "react";
-import Header from "../Components/Header";
 import "tailwindcss/tailwind.css";
-import { Outlet } from "react-router-dom";
 
-type HomeProps = {
+// type HomeProps = {
 
-};
+// };
 
-const HomePage = ({}: HomeProps) => (
-    <div className="">
-        <Header/>
-        <Outlet />
+const HomePage = () => (
+    <div>
+        <div className="text-slate-300 text-center text-3xl text-black">
+            가장 쉽게 설문지를 만드세요!
+        </div>
+        <div className="flex container  justify-center my-6">
+            <div className="flex  justify-center text-2xl font-bold h-14 w-28 border-blue-500 rounded-lg bg-gray-300">
+                <div className="flex">
+                    <button className="text-black">
+                        +
+                    </button>
+                </div>
+            </div>
+        </div>
+        <div className="text-slate-300 text-center text-xl text-black">
+            Create now
+        </div>
     </div>
 );
 

frontend/src/Pages/LoginPage.tsx

@@ -6,8 +6,31 @@ import "tailwindcss/tailwind.css";
 // };
 
 const LoginPage = () => (
-    <div className="text-slate-300 text-3xl font-bold">
-        로그인페이지
+    <div className="flex justify-center mt-3">
+        <div className="text-slate-300 text-xl font-bold">
+            <label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
+                이메일
+            </label>
+            <input
+                className="shadow appearance-none border rounded  py-2 px-3 text-gray-70"
+                id="email"
+                type="email"
+                placeholder="이메일을 입력하세요"
+            />
+
+            <label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
+                비밀번호
+            </label>
+            <input
+                className="shadow appearance-none border rounded py-2 px-3 text-gray-70"
+                id="username"
+                type="password"
+                placeholder="비밀번호를 입력하세요"
+            />
+            <div className='text-center'>
+                <button className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3">로그인</button>
+            </div>
+        </div>
     </div>
 );
 

frontend/src/Pages/RootPage.tsx

+import React from "react";
+import Header from "../Components/Header";
+import "tailwindcss/tailwind.css";
+import { Outlet } from "react-router-dom";
+
+const RootPage = () => (
+    <div>
+        <Header />
+        <Outlet />
+    </div>
+);
+
+export default RootPage;
\ No newline at end of file

frontend/src/Pages/SignUpPage.tsx

@@ -3,7 +3,7 @@ import 'tailwindcss/tailwind.css'
 
 type SignUpProps = {}
 
-const SignUpPage = ({}: SignUpProps) => (
+const SignUpPage = ({ }: SignUpProps) => (
   <div className="flex justify-center mt-3">
     <div className="text-slate-300 text-xl font-bold">
       <label className="block text-gray-700 text-sm font-bold mb-2 mt-3">
@@ -35,7 +35,7 @@ const SignUpPage = ({}: SignUpProps) => (
         placeholder="비밀번호를 입력하세요"
       />
       <div className='text-center'>
-      <button className="bg-cyan-400 text-white border rounded w-100 py-2 px-3 mt-3">회원가입</button>
+        <button className="bg-themeColor text-white border rounded w-100 py-2 px-3 mt-3">회원가입</button>
       </div>
     </div>
   </div>