mirror of
https://git.sr.ht/~ashkeel/strimertul
synced 2024-09-18 01:50:50 +00:00
Make checkboxes more like other UI elements
This commit is contained in:
parent
6d97f81c32
commit
bccea52b03
1 changed files with 19 additions and 4 deletions
|
@ -259,19 +259,34 @@ export const Checkbox = styled(CheckboxPrimitive.Root, {
|
|||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
border: '1px solid $teal6',
|
||||
backgroundColor: '$teal4',
|
||||
border: '1px solid $gray6',
|
||||
backgroundColor: '$gray4',
|
||||
'&:hover': {
|
||||
backgroundColor: '$teal5',
|
||||
borderColor: '$teal6',
|
||||
backgroundColor: '$gray5',
|
||||
},
|
||||
'&:active': {
|
||||
background: '$teal6',
|
||||
background: '$gray6',
|
||||
},
|
||||
'&:disabled': {
|
||||
backgroundColor: '$gray4',
|
||||
borderColor: '$gray5',
|
||||
color: '$gray8',
|
||||
},
|
||||
variants: {
|
||||
variation: {
|
||||
primary: {
|
||||
border: '1px solid $teal6',
|
||||
backgroundColor: '$teal4',
|
||||
'&:hover': {
|
||||
backgroundColor: '$teal5',
|
||||
},
|
||||
'&:active': {
|
||||
background: '$teal6',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export const CheckboxIndicator = styled(CheckboxPrimitive.Indicator, {
|
||||
|
|
Loading…
Reference in a new issue