search

gregnb / mui-datatables

Datatables for React using Material-UI
MIT License
2.71k stars 932 forks source link

Can't apply Theme in Material > v4.0.0 when mui-datatables is present #919

Open larissa-n opened 5 years ago

larissa-n commented 5 years ago

I feel bad for opening another issue with 203 open right now, but I have to at least mention it in case anybody else runs into this problem:

Theming and styles in Material UI in version 4 and onwards will not be applied if mui-datatables is present. Other Material UI features work (and I see that some work has happened vis-a-vis Material UI v4: https://github.com/gregnb/mui-datatables/issues/886), but <ThemeProvider theme={theme}> will be ignored unless mui-datatables is disabled.

gabrielliwerant commented 5 years ago

Haha, no worries @larissa-n, issues are issues! I do need to clean a bunch of the out as there are a lot of old ones out there that I think are no longer relevant.

What do you mean by "mui-datatables is disabled?" Are you saying that any project using mui v4 and this library will prevent any styling from working anywhere, even outside of the library?

If so, can you provide an example of the breakage in a codesandbox so I can take a look?

hbinkle commented 4 years ago

Hi, I do also have strange behavior with MUI theme in the table. e.g. when simply using the table (copied from the example) I get a white font on a white background for the header. The background should be black. That's at least how my appbar look like, white on black. However when I put the MuiThemeProvider again directly around the table setting the same theme, the table header font color is black. No, I don't set any special font colors in-between.

gabrielliwerant commented 4 years ago

Can you post a simple example to codesandbox @hbinkle?

hbinkle commented 4 years ago

Hi, with further investigation I found that the style "MUIDataTableHeadRow" overrides "MuiTableHead". "MUIDataTableHeadRow" can't be set any longer for MUIv4.x. How can I set "MUIDataTableHeadRow" in an typescript enviroment to get the correct background color?

kyesildagli commented 2 years ago

I am having the same issue. My appbar is normally blue, but turns white on white background when Muidatatable is present.

bentheiii commented 2 years ago

Can confirm, muidatatables blocks dark mode for the entire webpage.

BinarySteve commented 2 years ago

Also seeing issues where the stylings implemented through MUI of all components on the same page as the MUIDataTable are lost. Any movement on this issue @gabrielliwerant ?