需要在悬停和焦点上删除下划线 MUI TimePicker

Question

在使用 material-ui TimePicker 和覆盖样式时找不到删除下划线的方法。

这是我覆盖样式的方式：

const muiTimePickerStyle = createTheme({
    overrides: {
        MuiTextField: {
            root: {
                width: "100%",
                '&:after': {
                    underline: "none",
                    textDecoration: "none",
                }
            }
        },
        MuiInput: {
            root: {
                borderRadius: 0,
                backgroundColor: "#fff",
                border: '1px solid pink',
                fontSize: 16,
                padding: '10px 12px',
                width: '100%',
                underline: "none",
                textDecoration: "none",
                '&:hover': {

                }
            },
            underline: {
                underline: "none",
                '&:hover': {

                }
            }
        }
    }
});

我的代码在CodeSandbox

Answer 1

这就是您要查找的内容。如果您想在活动时删除蓝线，我也添加了后效。

          underline: {
              '&:hover:not(.Mui-disabled):before': {
                borderBottom: 'none'
              },
              '&:after': {
                borderBottom: 'none'
              }
          }

尽情享受

需要在悬停和焦点上删除下划线 MUI TimePicker

Need to remove underline on hover and on focus MUI TimePicker

reactjs

material-ui