status-im/wakuconnect-chat-sdk
2
0
Fork 0
mirror of https://github.com/status-im/wakuconnect-chat-sdk.git synced 2025-01-11 20:54:37 +00:00
Code Issues Projects Releases Wiki Activity

feat(system): use colors from design system in Button

Browse Source
This commit is contained in:
Pavel Prichodko 2022-03-31 15:13:22 +02:00
parent 1671da13bf
commit b662c253f3
No known key found for this signature in database
GPG Key ID: 0EB8D75C775AB6F1
1 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
packages/status-react/src/system/button/styles.tsx
View File

@ -14,31 +14,35 @@ export const Base = styled('button', {
justifyContent: 'center',
alignItems: 'center',
padding: '11px 24px',
borderRadius: 8,
borderRadius: '$8',
transitionProperty: 'background-color, border-color, color, fill, stroke',
transitionTimingFunction: 'cubic-bezier(0.4, 0, 0.2, 1)',
transitionDuration: '150ms',
'&:disabled': {
background: '#EEF2F5',
color: '#939BA1',
color: '$gray-1',
background: '$gray-2',
cursor: 'not-allowed',
'&:hover': {
background: '$gray-2',
},
},
variants: {
variant: {
default: {
background: 'rgba(67, 96, 223, 0.1)',
color: '#4360DF',
'&:hover': {},
},
minimal: {
'&:hover': {},
background: '$primary-3',
color: '$primary-1',
'&:hover': {
background: '$primary-2',
},
},
danger: {
background: 'rgba(255, 45, 85, 0.1)',
color: '#FF2D55',
'&:hover': {},
background: '$danger-3',
color: '$danger-1',
'&:hover': {
background: '$danger-2',
},
},
},
loading: {