1
0
Fork 0
mirror of https://git.sr.ht/~ashkeel/strimertul synced 2024-09-20 02:00:49 +00:00

Make checkboxes more like other UI elements

This commit is contained in:
Ash Keel 2022-01-15 11:53:55 +01:00
parent 6d97f81c32
commit bccea52b03
No known key found for this signature in database
GPG key ID: BAD8D93E7314ED3E

View file

@ -259,19 +259,34 @@ export const Checkbox = styled(CheckboxPrimitive.Root, {
display: 'flex', display: 'flex',
alignItems: 'center', alignItems: 'center',
justifyContent: 'center', justifyContent: 'center',
border: '1px solid $teal6', border: '1px solid $gray6',
backgroundColor: '$teal4', backgroundColor: '$gray4',
'&:hover': { '&:hover': {
backgroundColor: '$teal5', borderColor: '$teal6',
backgroundColor: '$gray5',
}, },
'&:active': { '&:active': {
background: '$teal6', background: '$gray6',
}, },
'&:disabled': { '&:disabled': {
backgroundColor: '$gray4', backgroundColor: '$gray4',
borderColor: '$gray5', borderColor: '$gray5',
color: '$gray8', color: '$gray8',
}, },
variants: {
variation: {
primary: {
border: '1px solid $teal6',
backgroundColor: '$teal4',
'&:hover': {
backgroundColor: '$teal5',
},
'&:active': {
background: '$teal6',
},
},
},
},
}); });
export const CheckboxIndicator = styled(CheckboxPrimitive.Indicator, { export const CheckboxIndicator = styled(CheckboxPrimitive.Indicator, {