Would it be possible to handle dark mode differently?

[Kam3leoN]

Before submitting...

• I have searched for duplicate or closed issues.
• I have read the CONTRIBUTING document and my issue is following the guidelines.
• I have read the template completely before filling it in.

Context

The darkmode is not advanced enough in terms of options

Current Behavior

The dark mode option is perfect but deserves to be deepened

Expected behavior

If possible, the ideal would be to be able to activate it as a component

Here are some interesting leads and cool options like:

1. Activation or not via the "materialize.init.js" file like the other components.
2. Dark mode with choice between: Dark, Light and Automatic (ex: in a drop-down menu) the automatic would be executed, if selected
   by the user instead of darkmode depending on the time of day (example "darkmode" between 19pm and 7am otherwise "lightmode", it's just one more condition but very practical).
3. Show toast (“Dark”, “Light”, “Automatic” mode “On”, “Off”).
4. Switching from darkmode to lightmode with a wave effect as (https://vuetifyjs.com/)

Possible Solutions or Causes

No response

Your Environment

MaterializeCSS : 2.0.1 alpha
Chrome : Version 114.0.5735.134 (Build officiel) (64 bits)
Windows 11 on desktop

[Jerit3787]

Hi, I would like to just give my opinions on this one. Actually, I think that this should be the website developer responsibility to implement this, not under the responsibility of maintainer as different websites have their own different needs and implementations. I haven't found a CSS library that do this yet on a library-level of implementations. Plus, it would be a hassle to properly maintain this as it will depends on other's library / browser feature. Would also want to hear from others as well. This is only mere my opinions.

EDIT : I wouldn't say it is impossible but I'm looking at other library approach.

[ivanBell199]

As a random (not advanced) user of the library I can say that I am completely happy with the current implementation. A simple example of JS theme-toggle and a list of CSS variables are fine for me

[Kam3leoN]

The idea is to appeal not just to one person but to a wide audience.
I agree with the fact that it is the developer of the site but in the absolute it is finally a component like any other some will use the sidebar others not, hence the idea of ​​making it a component and to give free rein to choice via options. ;)

[danice]

I agree with @Jerit3787 , a framework should leave open how to apply the styles.
For example, about this light / dark , it also exist the prefers-color-scheme , I have not used that but it seems a way for the user to fix its preferences from the browser:

prefers-color-scheme is used to detect if a user has requested light or dark color themes. A user indicates their preference through an operating system setting (e.g. light or dark mode) or a user agent setting.

If the framework had implemented what you said (the "automatic" option)it will conflict with this option.