Yuvaleros/material-ui-dropzone

Support Dark theme

bahaa-ka opened this issue · 2 comments

Feature Request

Describe the problem related to this feature request

your components work well with the default material light theme but when Dark theme is applied user has to provide CSS classes to override the background color of the container and color of the text

Describe the solution you'd like

  • add a prop to set the colors (not-preferred)
{
     background: "your color"
     foreground: "your color"
}
  • handle the theme internally (using useTheme() hook provided by material-ui) recommended

Describe alternatives you've considered

providing CSS classes manually to set the colors

Teachability, Documentation, Adoption, Migration Strategy

if applied internally no migration is needed

A fantastic way to test this out and do this would be to add a example to the documentation like

  const darkTheme = createMuiTheme({
   palette: {
     type: 'dark',
   },
  });

  return (
    <MuiThemeProvider theme={darkTheme }>
        <DropzoneArea />
    </MuiThemeProvider>
)

then we could showcase the feature and also ensure we haven't broken it easily whilst we're developing it

Hi @bahaa-ka ,

Thanks for your feedback, I tried applying a dark theme to an app including the DropzoneArea component and can confirm that it works as expected (with the latest version of the module) since we migrated the internal styles to use MaterialUI theme API a while back.