Showing
1 changed file
with
18 additions
and
2 deletions
1 | import React from 'react'; | 1 | import React from 'react'; |
2 | +import styled from 'styled-components'; | ||
3 | +import { buttonColorMap } from '../../lib/styles/palette'; | ||
2 | 4 | ||
3 | -const Button = () => { | 5 | +const ButtonBlock = styled.button` |
4 | - return <div>Button</div>; | 6 | + width: 20%; |
7 | + background-color: ${props => buttonColorMap[props.color].background}; | ||
8 | + &:hover { | ||
9 | + background-color: ${props => buttonColorMap[props.color].hoverBackground}; | ||
10 | + } | ||
11 | + color: ${props => buttonColorMap[props.color].color}; | ||
12 | + float: ${props => props.float || ''}; | ||
13 | +`; | ||
14 | + | ||
15 | +const Button = ({ children, color, float }) => { | ||
16 | + return ( | ||
17 | + <ButtonBlock color={color} float={float}> | ||
18 | + {children} | ||
19 | + </ButtonBlock> | ||
20 | + ); | ||
5 | }; | 21 | }; |
6 | 22 | ||
7 | export default Button; | 23 | export default Button; | ... | ... |
-
Please register or login to post a comment