search

mui / material-ui

Material UI: Comprehensive React component library that implements Google's Material Design. Free forever.
https://mui.com/material-ui/
MIT License
94.14k stars 32.35k forks source link

[joy-ui] Allow extending the color inversion feature #41510

Open jamietdavidson opened 8 months ago

jamietdavidson commented 8 months ago

Summary

The color inversion feature is incredibly neat. Unfortunately it's not clear how to override it so that I can change how font colors change during an inversion, for example.

I have overriden the theme's neutral parameters (to make them darker / lighter depending on whether light/dark is enabled).

Unfortunately, the typography's colors remain default (I believe because of how the default theme works). In other words, the colors of the text is always white.

I was hoping to be able to invert black / white for one section of the page (using <Sheet />), but it seems impossible to do with this feature currently. Please let me know if I am failing to understand something.

Examples

See above.

Motivation

Invert black & white completely

Search keywords: color inversion

jamietdavidson commented 8 months ago

Now that I think about it more, what I'm really trying to do is:

<Sheet invertColorScheme={true} />
    {children}
</Sheet>

Please make it happen :)

danilo-leal commented 8 months ago

Heya, thanks for opening this issue! I agree that there's more room to enhance the color inversion feature! Just a quick note, though, that given the team is currently focused on the Material UI v6th version, we might take a while to come back to future Joy UI development. So, in the meantime, I'll add the "waiting for 👍" label so we can gauge other folks' interest, which will help us prioritize later on :)

If you happen to do any prototypes yourself around this, we'd love to see them; so definitely share any reproducible Sandboxes!