43 lines
966 B
JavaScript
43 lines
966 B
JavaScript
import CheckIcon from '@mui/icons-material/Check';
|
|
import { Checkbox, styled } from '@mui/material';
|
|
|
|
const SquareIcon = styled('span')(() => ({
|
|
width: '1rem',
|
|
height: '1rem',
|
|
borderRadius: '0.25rem',
|
|
border: '0.1rem solid var(--Stroke, rgba(0, 0, 0, 0.1))',
|
|
backgroundColor: '#fff',
|
|
display: 'block',
|
|
boxSizing: 'border-box',
|
|
}));
|
|
|
|
const StyledCheckbox = styled(Checkbox)(() => ({
|
|
padding: 4,
|
|
|
|
'& .MuiSvgIcon-root': {
|
|
width: '1rem',
|
|
height: '1rem',
|
|
borderRadius: '0.25rem',
|
|
border: '0.1rem solid var(--Stroke, rgba(0, 0, 0, 0.1))',
|
|
backgroundColor: '#fff',
|
|
boxSizing: 'border-box',
|
|
},
|
|
|
|
'&.Mui-checked .MuiSvgIcon-root': {
|
|
borderColor: '#d5e5d5',
|
|
backgroundColor: '#EDF8F0',
|
|
},
|
|
|
|
'&.Mui-checked .MuiSvgIcon-root path': {
|
|
fill: '#258141',
|
|
},
|
|
|
|
'& .MuiTouchRipple-root': {
|
|
display: 'none',
|
|
},
|
|
}));
|
|
|
|
export const CustomCheckbox = (props) => {
|
|
return <StyledCheckbox icon={<SquareIcon />} checkedIcon={<CheckIcon />} {...props} />;
|
|
};
|