Skip to content
GitLab
Menu
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
Menu
Open sidebar
students
Today KU
Commits
80e70598
Commit
80e70598
authored
Oct 12, 2021
by
Kim, Subin
Browse files
ScheduleForm UI 완성
parent
bf620a10
Changes
2
Hide whitespace changes
Inline
Side-by-side
client/src/components/Form/ScheduleForm.js
View file @
80e70598
import
{
use
Effect
,
useRef
}
from
"
react
"
;
import
{
use
State
,
useEffect
}
from
"
react
"
;
import
BtnGroup
from
"
../Buttons/BtnGroup.js
"
;
import
BtnGroup
from
"
../Buttons/BtnGroup.js
"
;
import
catchErrors
from
"
../../utils/catchErrors.js
"
;
import
styles
from
"
./form.module.scss
"
;
import
styles
from
"
./form.module.scss
"
;
const
ScheduleForm
=
()
=>
{
const
ScheduleForm
=
()
=>
{
const
[
schedule
,
setSchedule
]
=
useState
({})
const
[
error
,
setError
]
=
useState
(
""
)
useEffect
(()
=>
{
},
[])
async
function
handleSubmit
(
e
)
{
e
.
preventDefault
()
try
{
setError
(
""
)
}
catch
(
error
)
{
catchErrors
(
error
,
setError
)
}
}
return
(
return
(
<
form
className
=
"
pt-5
"
>
<
form
className
=
"
pt-5
"
onSubmit
=
{
handleSubmit
}
>
<
input
className
=
{
`form-control form-control-lg shadow-none px-1 mb-5
${
styles
.
textInput
}
`
}
type
=
"
text
"
placeholder
=
"
제목
"
aria
-
label
=
"
title
"
autoFocus
/>
<
input
className
=
{
`form-control form-control-lg shadow-none px-1 mb-5
${
styles
.
textInput
}
`
}
type
=
"
text
"
placeholder
=
"
제목
"
aria
-
label
=
"
title
"
autoFocus
/>
<
div
className
=
"
d-flex mb-4
"
>
<
div
className
=
"
d-flex mb-4
"
>
<
label
className
=
"
col
-3
col-form-label
"
>
시작
<
/label
>
<
label
className
=
"
col col-form-label
align-self-center py-0
"
>
시작
<
/label
>
<
div
className
=
"
col-5
"
>
<
div
className
=
"
col-5
"
>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
date
"
aria
-
label
=
"
startDate
"
/>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
date
"
aria
-
label
=
"
startDate
"
/>
<
/div
>
<
/div
>
<
div
className
=
"
col-
4
"
>
<
div
className
=
"
col-
5
"
>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
time
"
aria
-
label
=
"
startTime
"
/>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
time
"
aria
-
label
=
"
startTime
"
/>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
<
div
className
=
"
d-flex mb-3
"
>
<
div
className
=
"
d-flex mb-3
"
>
<
label
className
=
"
col
-3
col-form-label
"
>
종료
<
/label
>
<
label
className
=
"
col col-form-label
align-self-center py-0
"
>
종료
<
/label
>
<
div
className
=
"
col-5
"
>
<
div
className
=
"
col-5
"
>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
date
"
aria
-
label
=
"
endDate
"
/>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
date
"
aria
-
label
=
"
endDate
"
/>
<
/div
>
<
/div
>
<
div
className
=
"
col-
4
"
>
<
div
className
=
"
col-
5
"
>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
time
"
aria
-
label
=
"
endTime
"
/>
<
input
className
=
{
`form-control shadow-none
${
styles
.
dateInput
}
`
}
type
=
"
time
"
aria
-
label
=
"
endTime
"
/>
<
/div
>
<
/div
>
<
/div
>
<
/div
>
...
...
client/src/components/Form/form.module.scss
View file @
80e70598
...
@@ -23,6 +23,8 @@
...
@@ -23,6 +23,8 @@
}
}
.dateInput
{
.dateInput
{
font-size
:
0
.75rem
;
&
:focus
{
&
:focus
{
border-color
:
crimson
;
border-color
:
crimson
;
}
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment