我尝试使用css className属性更改TimePicker中的一些属性,如Clock Color和Ok button fontColor,但没有成功。有人知道如何使用sx或slotProps更改它吗?
<TimePicker
ampm={false}
views={['hours', 'minutes', 'seconds']}
sx={{
backgroundColor: "#333335",
font: "white",
color: "#FFFF",
textDecoration: "bold",
input: {
color: "#FFFF",
fontSize: "1.4rem",
},
"& .MuiTimePicker-root": {
backgroundColor: "#222223",
},
"& .MuiTimePicker-input": {
color: "#FFFF",
fontSize: "1.2rem",
},
}}
slotProps={{
popper: {
sx: {
"& .MuiList-root": {
backgroundColor: "#333335",
},
"& .MuiMenuItem-root": {
"&.Mui-selected": {
backgroundColor: "#04395E",
color: "white"
},
color: "white"
},
"& .MuiDialogActions-root": {
backgroundColor: "#333335",
},
"& .MuiSvgIcon-root": {
"&.MuiSvgIcon-fontSizeMedium": {
backgroundColor: "#04395E",
color: "white"
},
color: "white"
},
},
},
}}
value={selectedTime}
onChange={(newTime: any) => setSelectedTime(newTime)}
timeSteps={{hours: 1, minutes: 1, seconds: 1}}
/>
字符串
下面是一个图像,显示了我想要更改颜色
的元素
1条答案
按热度按时间gywdnpxw1#
您可以将以下内容添加到
TimePicker
上的sx
属性,以更改时钟图标的颜色。字符串
对于OK文本按钮,可以在
popper
的sx
属性上使用以下内容型