materialize
materialize copied to clipboard
Dogfalo
Dark Mode/ Theme in materialize?
Expected Behavior
As Google added it to their Material Design Guidelines, are there any plans to implement it in materialize? What would it take? Icons would need to change from Black to White, background colors, text colors, what else? Are there plans for integrating this yet? Or is it just out of scope for this project, as in everyone needs to implement this for themselves?
Context
As many major websites and apps are offering dark themes for multiple reasons, I think it would be great to help people who already use materialize to implement this really quick. Maybe by offering a second CSS file or a single variable?
@Dogfalo could someone at least mark this as feature request or acknowledge this? I don't have a problem if this won't be developed or doesn't fit the size of the project, but please close this then or decline it.
So what's going on with this feature? Any updates? @Dogfalo Please do something, people will be very excited to see dark theme in materialize, and more people will use it in their new projects.
Thank you
You can always compile SASS files with your own custom colors. edit: see file css/_variables.scss
Made a flexible and well working solution for the Dark Mode:
https://dorson.github.io/CSS-Dark-Mode-and-color-switch/
Works with basic CSS variables + short JavaScript.
Can be used to define multiple color themes in one CSS file or other dynamic style settings like text size settings, etc...
Have fun using my code !
Made a flexible and well working solution for the Dark Mode:
https://dorson.github.io/CSS-Dark-Mode-and-color-switch/
Works with basic CSS variables + short JavaScript.
Can be used to define multiple color themes in one CSS file or other dynamic style settings like text size settings, etc...
Have fun using my code !
This is the github link: https://github.com/Dorson/CSS-Dark-Mode-and-color-switch
Looking good so far, but I need materialize anyway.
What about just using the prefers-color-scheme CSS media query to detect user preference for dark mode without any buttons? Would this be welcome in materialize?
Or is the project still being maintained?
It would still be better to allow the developer to force the dark theme, let's say the user does not use prefers-color-scheme but still wants dark layout.
A nice feature of the javascript part would be to specify colors with var() CSS format in an array, so the SCSS files would not contain any color values at all, only var(--color-foreground...) placeholders, which could be changed at runtime.
On Wed, 28 Oct 2020, 23:01 Toni Melisma, [email protected] wrote:
What about just using the prefers-color-scheme CSS media query to detect user preference for dark mode without any buttons? Would this be welcome in materialize?
Or is the project still being maintained?
— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/Dogfalo/materialize/issues/6363#issuecomment-718233920, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKFM2EVFRUGV5R2BWVFF2G3SNCIENANCNFSM4HMPHB5A .