64 lines
1,014 B
TypeScript
64 lines
1,014 B
TypeScript
import { createStyle } from '@gluestack-style/react';
|
|
|
|
export const MenuItem = createStyle({
|
|
'p': '$3',
|
|
'flexDirection': 'row',
|
|
'alignItems': 'center',
|
|
|
|
':hover': {
|
|
bg: '$backgroundLight100',
|
|
},
|
|
|
|
':disabled': {
|
|
'opacity': 0.4,
|
|
'_web': {
|
|
cursor: 'not-allowed',
|
|
},
|
|
':focus': {
|
|
bg: 'transparent',
|
|
},
|
|
'_dark': {
|
|
':focus': {
|
|
bg: 'transparent',
|
|
},
|
|
},
|
|
},
|
|
|
|
':active': {
|
|
bg: '$backgroundLight200',
|
|
},
|
|
|
|
':focus': {
|
|
bg: '$backgroundLight100',
|
|
// @ts-ignore
|
|
outlineWidth: '$0',
|
|
outlineStyle: 'none',
|
|
},
|
|
|
|
':focusVisible': {
|
|
// @ts-ignore
|
|
outlineWidth: '$0.5',
|
|
outlineColor: '$primary700',
|
|
outlineStyle: 'solid',
|
|
_dark: {
|
|
outlineColor: '$primary300',
|
|
},
|
|
},
|
|
|
|
'_dark': {
|
|
':hover': {
|
|
bg: '$backgroundDark800',
|
|
},
|
|
|
|
':active': {
|
|
bg: '$backgroundDark700',
|
|
},
|
|
|
|
':focus': {
|
|
bg: '$backgroundDark800',
|
|
},
|
|
},
|
|
'_web': {
|
|
cursor: 'pointer',
|
|
},
|
|
});
|