Commit 6e86741e authored by Choi Ga Young's avatar Choi Ga Young
Browse files

세부사항 수정 완료

parent 3e9a1b16
......@@ -4,6 +4,7 @@ import { Formik } from 'formik';
import * as Yup from 'yup';
import authApi from '../../apis/auth.api';
import catchErrors from "../../utils/catchErrors.js";
import styles from "./form.module.scss";
const LoginForm = () => {
const [success, setSuccess] = useState(false);
......@@ -45,7 +46,7 @@ const LoginForm = () => {
<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 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
placeholder="아이디"
{...formik.getFieldProps('userId')} />
{formik.touched.userId && formik.errors.userId ? (
......@@ -54,7 +55,7 @@ const LoginForm = () => {
</div>
<div className="mb-3">
<input type="password" name="password"
className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
placeholder="비밀번호"
{...formik.getFieldProps('password')} />
{formik.touched.password && formik.errors.password ? (
......
......@@ -4,6 +4,7 @@ import { Formik } from 'formik';
import * as Yup from 'yup';
import authApi from '../../apis/auth.api';
import catchErrors from "../../utils/catchErrors.js";
import styles from "./form.module.scss";
const SignupForm = () => {
const [success, setSuccess] = useState(false);
......@@ -68,7 +69,7 @@ const SignupForm = () => {
<label className="form-label" style={{ width: "100px" }}>아이디</label>
<div className="flex-col">
<input type="text" name="userId"
className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
{...formik.getFieldProps('userId')} />
{formik.touched.userId && formik.errors.userId ? (
<div className="text-danger mt-1" style={{ fontSize: "10px" }}>{formik.errors.userId}</div>
......@@ -79,7 +80,7 @@ const SignupForm = () => {
<label className="form-label" style={{ width: "100px" }}>비밀번호</label>
<div className="flex-col">
<input type="password" name="password"
className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
{...formik.getFieldProps('password')} />
{formik.touched.password && formik.errors.password ? (
<div className="text-danger mt-1" style={{ fontSize: "10px" }}>{formik.errors.password}</div>
......@@ -90,7 +91,7 @@ const SignupForm = () => {
<label className="form-label" style={{ width: "100px", wordBreak: "keep-all" }}>비밀번호 확인</label>
<div className="flex-col">
<input type="password" name="repassword"
className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
{...formik.getFieldProps('repassword')} />
{formik.touched.repassword && formik.errors.repassword ? (
<div className="text-danger mt-1" style={{ fontSize: "10px" }}>{formik.errors.repassword}</div>
......@@ -101,7 +102,7 @@ const SignupForm = () => {
<label className="form-label" style={{ width: "100px" }}>이름</label>
<div className="flex-col">
<input type="text" name="userName"
className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
{...formik.getFieldProps('userName')} />
{formik.touched.userName && formik.errors.userName ? (
<div className="text-danger mt-1" style={{ fontSize: "10px" }}>{formik.errors.userName}</div>
......@@ -112,7 +113,7 @@ const SignupForm = () => {
<label className="form-label" style={{ width: "100px" }}>학번</label>
<div className="flex-col">
<input type="text" name="userStudNum"
className="form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0"
className={`form-control shadow-none rounded-0 ${styles.textInput}`}
{...formik.getFieldProps('userStudNum')} />
{formik.touched.userStudNum && formik.errors.userStudNum ? (
<div className="text-danger mt-1" style={{ fontSize: "10px" }}>{formik.errors.userStudNum}</div>
......
import { useState } from "react";
import moment from "moment";
import styles from "./modal.module.scss";
const TodoModal = () => {
const [todo, setTodo] = useState({
todoTitle: "",
todoDate: moment().format("YYYY-MM-DD")
})
const handleChange = (e) => {
const { name, value } = e.target
setTodo({ ...todo, [name]: value })
}
const handleClick = () => {
setTodo({
todoTitle: "",
todoDate: moment().format("YYYY-MM-DD")
})
}
return (
<>
<div className="modal fade" id="todomodal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content" style={{ backgroundColor: "crimson" }}>
<div className="modal-header px-2 py-1" >
<h5 className="modal-title text-white" id="staticBackdropLabel">To-do</h5>
<button type="button" className="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div className="modal-body" style={{ backgroundColor: "white" }}>
<input type="text" name="todoTitle"
className={`form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0 ${styles.textInput}`}
placeholder="제목" />
<label className="form-label m-2">날짜 </label>
<input type="date" value="2021-10-12" className="ms-4 mt-4" />
</div>
<div className="modal-footer p-1" style={{ backgroundColor: "white" }} >
<button type="button" className="btn btn-secondary btn-sm"
data-bs-dismiss="modal">취소</button>
<button type="button" className="btn btn-crimson btn-sm">확인</button>
<div className="modal fade" id="todomodal" data-bs-backdrop="static" data-bs-keyboard="false" tabIndex="-1" aria-labelledby="todoLabel" aria-hidden="true">
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content" style={{ backgroundColor: "crimson" }}>
<div className="modal-header px-2 py-1" >
<h5 className="modal-title text-white" id="todoLabel">To-do</h5>
<button type="button" className="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div className="modal-body bg-white">
<input type="text" name="todoTitle"
className={`form-control border-top-0 border-end-0 border-start-0 shadow-none rounded-0 ${styles.textInput}`}
placeholder="제목" onChange={handleChange} value={todo.todoTitle} />
<div className="d-flex justify-content-between mt-4">
<label className="col-2 col-form-label ms-2">날짜</label>
<div className="col-6 d-flex align-items-center">
<input type="date" className="form-control form-control-sm" name="todoDate" onChange={handleChange} value={todo.todoDate} />
</div>
</div>
</div>
<div className="modal-footer bg-white p-1" >
<button type="button" className="btn btn-secondary btn-sm"
data-bs-dismiss="modal" onClick={handleClick}>취소</button>
<button type="button" className="btn btn-crimson btn-sm">확인</button>
</div>
</div>
</div>
</>
</div>
)
}
......
......@@ -5,7 +5,7 @@ const TodoPostModal = () => {
<div className="modal-dialog modal-dialog-centered">
<div className="modal-content">
<div className="modal-body">
<p className="m-2">해당 일정을 내일로 미루시겠습니까?</p>
<p className="m-2 text-center" style={{ fontSize: "17px" }}>해당 일정을 내일로 미루시겠습니까?</p>
</div>
<div className="modal-footer p-1">
<button type="button" className="btn btn-crimson btn-sm"></button>
......
......@@ -18,26 +18,32 @@ const PlanItem = () => {
}
return (
<div className="d-flex">
<input className={`form-check-input rounded-0 shadow-none mt-1 ${styles2.checkBox}`} style={{width:"5%"}} type="checkbox" />
<div className="accordion-item border-0 col" style={{width:"95%"}}>
<button className={`d-flex flex-column align-items-start accordion-button collapsed bg-white shadow-none px-0 pt-0 ps-3 ${styles.activeBtn}`} type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
<h5 className={`accordion-header ${styles.title}`} id="flush-headingOne">
과제02 제출하기, 코딩과제 있음ssssssssss
</h5>
<p className={`text-secondary mb-0 ${styles.time}`}>~21.09.30 16:00</p>
</button>
<div id="flush-collapseOne" className="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="S#addplanlist">
<div className={`accordion-body px-0 pt-2 pb-0 mb-3 ${styles.textBox}`}>
컴퓨터의 프로세스 체크하는 프로그램 만들기 과제<br />결과화면 캡쳐해서 exe파일이랑 함께 압축하여 제출하기
<div className="d-flex justify-content-end mt-3">
<Link className="btn btn-light btn-sm border-dark" to="/studyplan/edit">수정</Link>
<button type="button" className="btn btn-crimson btn-sm ms-2" onClick={delSchedule}>삭제</button>
<div className="d-flex">
<input className={`form-check-input rounded-0 shadow-none mt-1 ${styles2.checkBox}`} style={{ width: "5%" }} type="checkbox" />
<div className="accordion-item border-0 col" style={{ width: "95%" }}>
<button className={`d-flex flex-column align-items-start accordion-button collapsed bg-white shadow-none px-0 pt-0 ps-3 ${styles.activeBtn}`} type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
<h5 className={`accordion-header ${styles.title}`} id="flush-headingOne">
과제02 제출하기, 코딩과제 있음ssssssssss
</h5>
<p className={`text-secondary mb-0 ${styles.time}`}>~21.09.30 16:00</p>
</button>
<div id="flush-collapseOne" className="accordion-collapse collapse" aria-labelledby="flush-headingOne" data-bs-parent="S#addplanlist">
<div className={`accordion-body px-0 pt-2 pb-0 mb-3 ${styles.textBox}`}>
<div className="d-flex align-items-start fw-bold">
<i class="bi bi-clock-history fs-5"></i>
<div className="col-11 ms-2 align-self-center">
21.09.30 16:00
</div>
</div>
컴퓨터의 프로세스 체크하는 프로그램 만들기 과제<br />결과화면 캡쳐해서 exe파일이랑 함께 압축하여 제출하기
<div className="d-flex justify-content-end mt-3">
<Link className="btn btn-light btn-sm border-dark" to="/studyplan/edit">수정</Link>
<button type="button" className="btn btn-crimson btn-sm ms-2" onClick={delSchedule}>삭제</button>
</div>
</div>
</div>
</div>
</div>
)
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment