crowetic/protocol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix button and center

Browse Source
This commit is contained in:
Fabio Berger
2018-10-10 22:31:18 +02:00
parent fb882b0c77
commit 7418932432
2 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
packages/dev-tools-pages/ts/components/ui/button.tsx
View File

@@ -31,28 +31,25 @@ export const Button = styled(PlainButton)`
border-radius: 3px;
outline: none;
width: ${props => props.width};
background-color: ${props => (props.backgroundColor ? props.theme[props.backgroundColor] : 'none')};
border: ${props => (props.borderColor ? `1px solid ${props.theme[props.borderColor]}` : 'none')};
background-color: ${props => (props.backgroundColor ? props.backgroundColor : 'none')};
border: ${props => (props.borderColor ? `1px solid ${props.backgroundColor}` : 'none')};
&:hover {
background-color: ${props =>
!props.isDisabled
? darken(darkenOnHoverAmount, props.theme[props.backgroundColor || 'white'])
: ''} !important;
!props.isDisabled ? darken(darkenOnHoverAmount, props.backgroundColor) : ''} !important;
}
&:active {
background-color: ${props =>
!props.isDisabled ? darken(darkenOnActiveAmount, props.theme[props.backgroundColor || 'white']) : ''};
background-color: ${props => (!props.isDisabled ? darken(darkenOnActiveAmount, props.backgroundColor) : '')};
}
&:disabled {
opacity: 0.5;
}
&:focus {
background-color: ${props => saturate(saturateOnFocusAmount, props.theme[props.backgroundColor || 'white'])};
background-color: ${props => saturate(saturateOnFocusAmount, props.backgroundColor)};
}
`;
Button.defaultProps = {
backgroundColor: 'black',
backgroundColor: 'red',
width: 'auto',
isDisabled: false,
padding: '1em 2.2em',