Skip to content

B
bkunyun
Commit d10e919b authored by chenshouchao's avatar chenshouchao
Browse files
Options

feat: 修改switch组件

parent ea0d7bdb
Hide whitespace changes
Inline Side-by-side
Showing with 35 additions and 45 deletions
src/components/mui/MySwitch.tsx
View file @ d10e919b
...@@ -27,56 +27,46 @@ const MySwitch = (props: IMySwitchProps) => { ...@@ -27,56 +27,46 @@ const MySwitch = (props: IMySwitchProps) => {
...other ...other
} = props; } = props;
const bgColor = useMemo(() => { const theme = useMemo(() => {
if (disabled) { return createTheme({
if (value) { components: {
return "rgba(166, 211, 255, 1)"; MuiSwitch: {
} else { styleOverrides: {
return "rgba(221, 225, 230, 1)"; root: {
} boxSizing: "border-box",
} else { padding: "0",
if (value) { },
return "rgba(19, 112, 255, 1)"; switchBase: {
} else { top: "4px",
return "rgba(221, 225, 230, 1)"; left: "4px",
} padding: 0,
} "&.Mui-checked": {
}, [disabled, value]); left: "2px",
"& + .MuiSwitch-track": {
const theme = createTheme({ backgroundColor: disabled
components: { ? "rgba(166, 211, 255, 1)"
MuiSwitch: { : "rgba(19, 112, 255, 1)",
styleOverrides: { opacity: 1,
root: { },
boxSizing: "border-box",
padding: "0",
},
switchBase: {
top: "4px",
left: "4px",
padding: 0,
"&.Mui-checked": {
left: "2px",
"& + .MuiSwitch-track": {
backgroundColor: bgColor,
opacity: 1,
}, },
}, },
}, thumb: {
thumb: { width: "14px",
width: "14px", height: "14px",
height: "14px", color: "#fff",
color: "#fff", },
}, track: {
track: { borderRadius: "11px",
borderRadius: "11px", backgroundColor: disabled
backgroundColor: "rgba(221, 225, 230, 1)", ? "RGBA(240, 242, 245, 1)"
opacity: 1, : "RGBA(221, 225, 230, 1)",
opacity: 1,
},
}, },
}, },
}, },
}, });
}); }, [disabled]);
return ( return (
<ThemeProvider theme={theme}> <ThemeProvider theme={theme}>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment