OpenEnergyDashboard / OED

Open Energy Dashboard (OED)
Mozilla Public License 2.0
82 stars 310 forks source link

Dark Mode Option #876

Open spearec opened 1 year ago

spearec commented 1 year ago

Is your feature request related to a problem? Please describe.

Many sites on the internet support dark mode, either as a default, compatible with the browser, or just manually set by the user. Since this is mainly a CSS change and redux/react and plotly both support it, I believe this should not be too difficult to implement.

Describe the solution you'd like

There should be a setting, similar to the current language setting, that allows the user to turn on dark mode. Potentially, there can also be an admin preference that allows dark mode to be on by default. A quick search turned up a number of tutorials on how to add dark mode using redux/react, such as: https://medium.com/how-to-react/create-dark-mode-in-react-js-using-redux-hooks-9b4155968050

Describe alternatives you've considered

Continue with a single theme, which is already implemented and working fine.

Additional context

This is an issue I may work on in the near future, but I may not have the time; so it could be a good first issue for someone else since I believe it will not be very complicated to implement.

spearec commented 1 year ago

An update on this - I've spent some time looking into adding dark mode and it has proven to be considerably more work than expected. I have discovered at least four ways to implement this, each to varying degrees of success. The current "best" version works, but I do not know why; so that's one thing. There are packages that are intended to style react components (such as styled-components) so that is another avenue I have not explored.

If someone is interested in working on this issue, feel free to reach out to me with any questions and I would be happy to explain my progress so far. I am not actively working on this issue right now.

syrok94 commented 6 months ago

Hey, can I work on this?

huss commented 6 months ago

Hey, can I work on this?

Sure. We are happy to have help. I've assigned you this issue. @spearec may be able to help/give history and I think their work is at https://github.com/spearec/OED/tree/darkmode. Let me know if I can help.

tien-han commented 1 week ago

Hi Steve, I noticed that there hasn't been any progress on this ticket since May 2023, and I'm not sure if the previous person assigned is still working on it.

Can I take this on?

huss commented 6 days ago

@tien-han Thanks for offering to work on this. I've assigned you the issue.

@syrok94 You asked to work on this and were assigned this issue a while ago. If you have anything to report or want to discuss continuing to work on this then please let me know soon as the other developer is going to start. Thanks.