Toggle navigation
Toggle navigation
This project
Loading...
Sign in
2021-1-capstone-design1
/
GCL_Project1
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
이승윤
2021-04-18 18:32:44 +0900
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
36cc93d1f9df3b961a1bfac6ce8423a67433e8de
36cc93d1
1 parent
3a4c1cbd
feat: Common component 추가- DropDownList
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
41 additions
and
0 deletions
frontend/src/components/common/DropDownList.js
frontend/src/components/common/DropDownList.js
0 → 100644
View file @
36cc93d
import
React
from
'react'
;
import
styled
from
'styled-components'
;
import
{
dropdownListColorMap
}
from
'../../lib/styles/palette'
;
const
DropDownListBlock
=
styled
.
div
`
float:
${
props
=>
props
.
float
||
''
}
;
width:
${
props
=>
props
.
size
||
'40%'
}
;
`
;
const
DropDownList
=
styled
.
ul
`
padding: 0;
margin: 0;
background-color:
${
props
=>
dropdownListColorMap
[
props
.
color
].
background
}
;
border: 2px solid
${
props
=>
dropdownListColorMap
[
props
.
color
].
borderColor
}
;
box-sizing: border-box;
color:
${
props
=>
dropdownListColorMap
[
props
.
color
].
color
}
;
font-size: 1.3rem;
font-weight: 500;
&:first-child {
padding-top: 0.5em;
}
`
;
const
ListItem
=
styled
.
li
`
list-style: none;
padding-left: 1em;
padding-bottom: 0.3em;
border-bottom: 2px solid #e5e5e5;
`
;
const
DropDown
=
({
children
,
color
,
float
,
size
})
=>
{
return
(
<
DropDownListBlock
color
=
{
color
}
float
=
{
float
}
size
=
{
size
}
>
<
DropDownList
color
=
{
color
}
>
<
ListItem
>
{
children
}
<
/ListItem
>
<
/DropDownList
>
<
/DropDownListBlock
>
);
};
export
default
DropDown
;
Please
register
or
login
to post a comment