@unicity/design-system
Version:
A comprehensive React component library built on Material-UI with advanced theming capabilities including neumorphism design support
60 lines • 1.84 kB
JavaScript
import { styled } from '@mui/material/styles';
import { Select, FormControl } from '@mui/material';
export const StyledFormControl = styled(FormControl)(({ theme }) => ({
'& .MuiInputLabel-root': {
color: theme.palette.text.secondary,
'&.Mui-focused': {
color: theme.palette.primary.main,
},
'&.Mui-error': {
color: theme.palette.error.main,
},
},
'& .MuiFormHelperText-root': {
marginTop: theme.spacing(0.5),
'&.Mui-error': {
color: theme.palette.error.main,
},
},
}));
export const StyledSelect = styled(Select)(({ theme }) => ({
'& .MuiOutlinedInput-root': {
borderRadius: theme.shape.borderRadius,
backgroundColor: theme.palette.background.paper,
transition: theme.transitions.create([
'border-color',
'background-color',
'box-shadow',
]),
'&:hover': {
'& .MuiOutlinedInput-notchedOutline': {
borderColor: theme.palette.primary.main,
},
},
'&.Mui-focused': {
'& .MuiOutlinedInput-notchedOutline': {
borderColor: theme.palette.primary.main,
borderWidth: 2,
},
},
'&.Mui-error': {
'& .MuiOutlinedInput-notchedOutline': {
borderColor: theme.palette.error.main,
},
},
},
'& .MuiSelect-select': {
fontSize: '12px',
padding: theme.spacing(1),
'&.MuiSelect-selectSmall': {
padding: theme.spacing(1),
},
},
'& .MuiSelect-icon': {
color: theme.palette.text.secondary,
'&.Mui-disabled': {
color: theme.palette.action.disabled,
},
},
}));
//# sourceMappingURL=Select.style.js.map