search

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
3.79k stars 1.12k forks source link

[pickers] `DateTimePicker` ok button text is not changing for dark theme #12841

Closed amitconnectwise closed 2 weeks ago

amitconnectwise commented 2 weeks ago

Steps to reproduce

Link to live example: (required)

Steps: 1. 2. 3.

Current behavior

No response

Expected behavior

No response

Context

datepicker ok button text color is not visible for dark theme Screenshot (96)

Your environment

npx @mui/envinfo ``` Don't forget to mention which browser you used. Output from `npx @mui/envinfo` goes here. ```

Search keywords: datepicker ok button

michelengelen commented 2 weeks ago

Hey @amitconnectwise ... The Button inside the actionbar are using the material-ui Buttton component, so they will be impacted by the global theming. The text is readable just fine on the default themes, so if you provide a custom theme for your application you need to adjust the colors of that by yourself.

You can also override the styling with the sx prop on the actionBar using the slotProps on the DateTimePicker component:

<DateTimePicker
  label="Date time picker"
  slotProps={{
    actionBar: {
      sx: (theme) => ({
        '& .MuiButton-root': {
          color: theme.palette.secondary.main,
        },
      }),
    },
  }}
/>

Does that solve your problem?

amitconnectwise commented 2 weeks ago

Yes, this solves the issue. Thank you for your advice.

michelengelen commented 2 weeks ago

Great ... glad we could help you! 🎉

github-actions[bot] commented 2 weeks ago

:warning: This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

@amitconnectwise: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.