xxxxxxxxxx
MuiOutlinedInput: {
styleOverrides: {
root: ({ ownerState }) => ({
height: 48,
fontSize: 14,
fontWeight: 400,
color: theme.palette.common.black,
"& :-webkit-autofill": {
WebkitBoxShadow: "0 0 0 1000px white inset",
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: theme.palette[ownerState?.color ? ownerState.color : "primary"][100],
},
"&:hover:not(.Mui-error):not(.Mui-focused):not(.Mui-disabled) .MuiOutlinedInput-notchedOutline": {
borderColor: theme.palette[ownerState?.color ? ownerState.color : "primary"][200],
},
"&.Mui-focused:not(.Mui-error) .MuiOutlinedInput-notchedOutline": {
borderColor: theme.palette[ownerState?.color ? ownerState.color : "primary"][500],
},
}),
},
},
xxxxxxxxxx
MuiFilledInput: {
styleOverrides: {
root: ({ ownerState }) => ({
borderRadius: 10,
backgroundColor: theme.palette[ownerState?.color ? ownerState.color : "primary"][50],
color: theme.palette.common.black,
height: 48,
"& input": {
fontSize: 14,
fontWeight: 400,
paddingTop: 14,
},
"& :-webkit-autofill": {
borderRadius: 10,
paddingBottom: 16,
WebkitBoxShadow: `0 0 0 1000px ${
theme.palette[ownerState?.color ? ownerState.color : "primary"][50]
} inset`,
"&:hover": {
WebkitBoxShadow: `0 0 0 1000px ${
theme.palette[ownerState?.color ? ownerState.color : "primary"]["light"]
} inset`,
},
},
"&:hover": {
backgroundColor: theme.palette[ownerState?.color ? ownerState.color : "primary"]["light"],
},
"&.Mui-focused": {
backgroundColor: theme.palette[ownerState?.color ? ownerState.color : "primary"][50],
},
"&.Mui-disabled": {
backgroundColor: theme.palette.grey[50],
},
"&.Mui-error": {
backgroundColor: "#FBF0E1",
"& :-webkit-autofill": {
WebkitBoxShadow: "0 0 0 1000px #FBF0E1 inset",
borderRadius: 10,
},
},
}),
underline: {
"&&&:before": {
borderBottom: "none",
},
"&&:after": {
borderBottom: "none",
},
},
},
},