Login&Signup css 수정

client/src/components/LoginForm.js → client/src/components/Form/LoginForm.js

 import React from 'react';
+import { Link } from "react-router-dom";
 import { Formik } from 'formik';
 import * as Yup from 'yup';
-import { Link } from "react-router-dom";
 
 const LoginForm = () => {
   return (
-    <div>
+    <>
       <Formik
         initialValues={{
           userId: '',
           password: '',
         }}
-
         validationSchema={Yup.object({
           userId: Yup.string()
             .required('아이디를 입력해주세요.'),
@@ -26,15 +25,15 @@ const LoginForm = () => {
         }}
       >
         {formik => (
-          <form onSubmit={formik.handleSubmit} className=" m-5" >
-            <div className="mb-3  ">
+          <form onSubmit={formik.handleSubmit} className="m-5">
+            <div className="mb-3">
               <input type="text" name="userId"
                 className="form-control border-top-0 border-end-0 border-start-0"
                 style={{ boxShadow: "none", borderRadius: "0" }}
                 placeholder="아이디"
                 {...formik.getFieldProps('userId')} />
               {formik.touched.userId && formik.errors.userId ? (
-                <div className="text-danger " style={{fontSize: "10px"}}>{formik.errors.userId}</div>
+                <div className="text-danger " style={{ fontSize: "10px" }}>{formik.errors.userId}</div>
               ) : null}
             </div>
             <div className="mb-3">
@@ -44,7 +43,7 @@ const LoginForm = () => {
                 placeholder="비밀번호"
                 {...formik.getFieldProps('password')} />
               {formik.touched.password && formik.errors.password ? (
-                <div className="text-danger" style={{fontSize: "10px"}}>{formik.errors.password}</div>
+                <div className="text-danger" style={{ fontSize: "10px" }}>{formik.errors.password}</div>
               ) : null}
             </div>
             <div className="d-grid gap-2 mt-5">
@@ -54,7 +53,7 @@ const LoginForm = () => {
           </form>
         )}
       </Formik>
-    </div>
+    </>
   );
 }
 

client/src/components/SignupForm.js → client/src/components/Form/SignupForm.js

 import React from 'react';
 import { Formik } from 'formik';
 import * as Yup from 'yup';
-import BackBtn from './Buttons/BackBtn';
 
 const SignupForm = () => {
   return (
-    <div>
-      <BackBtn />
-      <div className="d-inline-block" style={{ width: "-webkit-fill-available" }}>
-        <h1 className="text-center my-4"
-        >회원가입</h1>
+    <>
+      <div className="py-5">
+        <h1 className="text-center">회원가입</h1>
       </div>
       <Formik
         initialValues={{
@@ -19,7 +16,6 @@ const SignupForm = () => {
           userName: '',
           userStudNum: ''
         }}
-
         validationSchema={Yup.object({
           userId: Yup.string()
             .required('아이디를 입력해주세요.')
@@ -46,7 +42,7 @@ const SignupForm = () => {
         }}
       >
         {formik => (
-          <form onSubmit={formik.handleSubmit} className="mt-5" >
+          <form onSubmit={formik.handleSubmit} className="mt-3">
             <div className="mb-3 d-flex flex-row">
               <label className="form-label" style={{ width: "100px" }}>아이디</label>
               <div className="flex-col">
@@ -113,9 +109,8 @@ const SignupForm = () => {
           </form>
         )}
       </Formik>
-    </div>
+    </>
   );
 }
 
 export default SignupForm;
\ No newline at end of file
-

client/src/pages/LoginPage.js

 import React from 'react';
-import LoginForm from '../components/LoginForm';
+import LoginForm from '../components/Form/LoginForm';
 
 function LoginPage() {
   return (
     <>
-      <div className="d-inline-block" style={{width:"-webkit-fill-available"}}>
-        <h1  className="mt-4">오늘의 KU</h1>
+      <div className="py-5">
+        <h1>오늘의 KU</h1>
         <p className="ms-4">-일정관리앱</p>
       </div>
       <LoginForm />

client/src/pages/SignupPage.js

-import SignupForm from '../components/SignupForm';
+import BackBtn from "../components/Buttons/BackBtn.js";
+import SignupForm from '../components/Form/SignupForm';
 
-function SingupPage () {
-
-  return(
+function SingupPage() {
+  return (
+    <>
+      <BackBtn />
       <SignupForm />
+    </>
   );
 }