diff options
Diffstat (limited to 'packages/website/ts/@next/components/button.tsx')
-rw-r--r-- | packages/website/ts/@next/components/button.tsx | 15 |
1 files changed, 12 insertions, 3 deletions
diff --git a/packages/website/ts/@next/components/button.tsx b/packages/website/ts/@next/components/button.tsx index bbb6b7935..e67f8a8e1 100644 --- a/packages/website/ts/@next/components/button.tsx +++ b/packages/website/ts/@next/components/button.tsx @@ -5,15 +5,20 @@ import { colors } from 'ts/style/colors'; export interface ButtonInterface { text: string; + transparent?: any; } -const StyledButton = styled.button` +const StyledButton = styled.button<ButtonInterface>` appearance: none; border: 0; background-color: ${colors.brandLight}; color: ${colors.white}; text-align: center; padding: 13px 22px 14px; + + ${props => props.transparent && ` + border: 1px solid #6A6A6A; + `} `; const Text = styled.span` @@ -22,8 +27,12 @@ const Text = styled.span` line-height: 1.375rem; `; -export const Button: React.StatelessComponent<ButtonInterface> = ({ text }) => ( - <StyledButton> +export const Button: React.StatelessComponent<ButtonInterface> = ({ text, transparent }) => ( + <StyledButton transparent> <Text>{text}</Text> </StyledButton> ); + +Button.defaultProps = { + transparent: false, +}; |