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
13c2b712
Commit
13c2b712
authored
Oct 31, 2021
by
Choi Ga Young
Browse files
Todo 컴포넌트 분리 및 세부사항 수정
parent
5f9f71fb
Changes
4
Hide whitespace changes
Inline
Side-by-side
client/src/components/Modal/TodoModal.js
View file @
13c2b712
import
styles
from
"
./modal.module.scss
"
;
const
TodoModal
=
()
=>
{
return
(
<>
<
div
className
=
"
modal fade
"
id
=
"
staticBackdrop
"
data
-
bs
-
backdrop
=
"
static
"
data
-
bs
-
keyboard
=
"
false
"
tabindex
=
"
-1
"
aria
-
labelledby
=
"
staticBackdropLabel
"
aria
-
hidden
=
"
true
"
>
<
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
"
>
...
...
@@ -10,7 +12,7 @@ const TodoModal = () => {
<
/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
"
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
"
/>
...
...
client/src/components/Modal/modal.module.scss
View file @
13c2b712
...
...
@@ -8,4 +8,13 @@
.body
{
height
:
350px
}
.textInput
{
border
:
none
;
border-bottom
:
1px
solid
#000
;
&
:focus
{
border-color
:
crimson
;
}
}
\ No newline at end of file
client/src/components/TodoList.js
0 → 100644
View file @
13c2b712
import
TodoModal
from
"
../components/Modal/TodoModal.js
"
;
import
TodoPostModal
from
"
../components/Modal/TodoPostModal.js
"
;
import
styles
from
"
../components/Form/form.module.scss
"
;
const
TodoList
=
()
=>
{
return
(
<
div
className
=
"
d-flex mt-3
"
>
<
div
className
=
"
d-flex align-items-center
"
style
=
{{
width
:
"
75%
"
}}
>
<
input
className
=
{
`form-check-input rounded-0 shadow-none mt-0
${
styles
.
checkBox
}
`
}
type
=
"
checkbox
"
/>
<
label
className
=
"
form-check-label fs-5 ms-3 pe-2 text-nowrap
"
style
=
{{
overflow
:
"
hidden
"
,
textOverflow
:
"
ellipsis
"
}}
>
과제03
제출하기sadsa
<
/label
>
<
/div
>
<
div
className
=
"
d-flex justify-content-between
"
style
=
{{
cursor
:
"
pointer
"
,
width
:
"
25%
"
}}
>
<
i
class
=
"
bi bi-arrow-right fs-5
"
data
-
bs
-
toggle
=
"
modal
"
data
-
bs
-
target
=
"
#postmodal
"
><
TodoPostModal
/><
/i
>
<
i
className
=
"
bi bi-pencil-square fs-5
"
data
-
bs
-
toggle
=
"
modal
"
data
-
bs
-
target
=
"
#todomodal
"
><
/i
>
<
TodoModal
/>
<
i
className
=
"
bi bi-trash fs-5
"
><
/i
>
<
/div
>
<
/div
>
)
}
export
default
TodoList
;
\ No newline at end of file
client/src/pages/ToDoPage.js
View file @
13c2b712
import
Menu
from
"
../components/Menu/Menu.js
"
;
import
HomeBtn
from
"
../components/Buttons/HomeBtn.js
"
;
import
TodoModal
from
"
../components/Modal/TodoModal.js
"
;
import
TodoPostModal
from
"
../components/Modal/TodoPostModal.js
"
;
import
Footer
from
"
../components/Footer.js
"
;
import
styles
from
"
../components/
Form/form.module.scs
s
"
;
import
TodoList
from
"
../components/
TodoList.j
s
"
;
const
ToDoPage
=
()
=>
{
return
(
...
...
@@ -14,18 +12,7 @@ const ToDoPage = () => {
<
div
>
캘린더
자리
<
/div
>
<
div
className
=
"
d-flex justify-content-between mt-3
"
>
<
div
className
=
"
d-flex align-items-center
"
>
<
input
className
=
{
`form-check-input rounded-0 shadow-none mt-0
${
styles
.
checkBox
}
`
}
type
=
"
checkbox
"
/>
<
label
className
=
{
`form-check-label fs-5 ms-3
${
styles
.
title
}
`
}
>
과제03
제출하기sadsa
<
/label
>
<
/div
>
<
div
style
=
{{
cursor
:
"
pointer
"
}}
>
<
i
class
=
"
bi bi-arrow-right pe-2 fs-5
"
data
-
bs
-
toggle
=
"
modal
"
data
-
bs
-
target
=
"
#postmodal
"
><
TodoPostModal
/><
/i
>
<
i
className
=
"
bi bi-pencil-square pe-2 fs-5
"
data
-
bs
-
toggle
=
"
modal
"
data
-
bs
-
target
=
"
#staticBackdrop
"
><
/i
>
<
TodoModal
/>
<
i
className
=
"
bi bi-trash fs-5
"
><
/i
>
<
/div
>
<
/div
>
<
TodoList
/>
<
Footer
/>
<
/
>
)
...
...
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