Merge pull request #15 from LetsExercise/feat-loginpage

[Feat]: 로그인 페이지 디자인

src/app/login/page.module.scss

@@ -1,36 +1,24 @@
-.login_page {
-    width: 100%;
+
+@import '../../lib/styles/_palette.scss';
+
+.main {
     height: 100vh;
+    padding: 100px 50px;
     display: flex;
     flex-direction: column;
     align-items: center;
+    justify-content: space-between;
+}
+
+.inputs{
+  margin: auto;
+  text-align: center;
+  input{
+    margin: 5px;
   }
-
-  .auth_title{
-
-  }
-
-  .login_page h1 {
-    margin-top: 20px;
-    margin-bottom: 20px;
-    color: #4BBD5D;
-  }
-
-  .login_space{
-
-  }
-
-  .login_button{
-    display: flex;
-    bottom: 60px;
-    width: 80%;
-    height: 50px;
-    /* fill: #4BBD5D; */
-    /* font: ; */
-    color: #fff;
-    background: #4BBD5D;
-    border-radius: 12px;
-    justify-content: center;
-    align-items: center;
-    position: absolute;
-  }
+}
+
+.button{
+  background-color: $light-gray-color;
+  width: 100%;
+}

src/app/login/page.tsx

@@ -4,7 +4,7 @@ import { FormEvent, use } from "react";
 import { useRouter } from "next/navigation";
 import styles from "./page.module.scss";
 import { login } from "@/lib/firebase/api/authAPI";
-
+import Logo from "../_common/Logo";
 export default function LoginPage() {
   const router = useRouter();
 
@@ -18,17 +18,18 @@ export default function LoginPage() {
   };
 
   return (
-    <form className={styles.login_page} onSubmit={(e) => handleLogin(e)}>
-      <h1>Rainit</h1>
-      <div>
+    <form className={styles.main} onSubmit={(e) => handleLogin(e)}>
+      <Logo/>
+      <div className={styles.inputs}>
         <input type="email" name="email" placeholder="이메일을 입력하세요" />
         <input
           type="password"
           name="password"
           placeholder="비밀번호를 입력하세요"
         />
       </div>
-      <button type="submit" className={styles.login_button}>
+
+      <button type="submit" className={styles.button}>
         로그인
       </button>
     </form>