Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[on hold ] Dark theme #35

Open
wants to merge 6 commits into
base: develop
Choose a base branch
from
Open

[on hold ] Dark theme #35

wants to merge 6 commits into from

Conversation

hodovani
Copy link
Contributor

The purpose of this PR is to add a dark theme to the app.

An example of dark theme:

image

An example of light theme:

image

A user can toggle theme with a button in menu:

image

@hodovani hodovani marked this pull request as ready for review December 16, 2020 15:10
@ltalirz
Copy link
Member

ltalirz commented Dec 18, 2020

thanks a lot @hodovani for this contribution! (and sorry for the dealy; these days were very busy)

I think a dark theme for materials cloud sounds like a great idea - we would just need to make it work across the website.
I'll float the idea in the next materials cloud meeting on January 6th.

Until that point: I saw that you modified the mcloud_theme.css here - these changes should go in the frontend-theme repository.
Apologies for the lack of modularity here, rather than having a copy of the mcloud_theme.min.css in this repo (as well as the header html + controllers), the header should really be its own package that is then used by the aiida-explorer (as well as the other frontend apps).

If you have suggestions on how to best go about that, they would be most welcome!

@hodovani
Copy link
Contributor Author

@ltalirz thanks for links. I'll have a look at how we can use frontend-theme as a module :)

@ltalirz
Copy link
Member

ltalirz commented Jan 11, 2021

@hodovani I brought up your suggestion in the Materials Cloud meeting and there were no objections - so we are free to go ahead and roll it out across Materials Cloud :-)

However, as mentioned, this change will need to be made in the frontend-theme repository and then imported here.

I'm usually programming in python, and the default package manager pip allows to install packages directly from github.
Could one build something similar, where the frontend-theme package is somehow npm-installed from github into the frontend apps?

P.S. Happy new year!

@hodovani
Copy link
Contributor Author

@ltalirz Sorry, creating a separate module with the styles would take more time than I have at the moment. I hope to return to this at some point in future...

@ltalirz
Copy link
Member

ltalirz commented Jan 23, 2021

No worries, I also chatted with Evgeny - let's see whether someone from our team will find the time to do this refactoring at some point.
I'll leave the PR open for the moment

@ltalirz ltalirz changed the title Dark theme [on hold ] Dark theme Jan 26, 2021
@blokhin
Copy link

blokhin commented Jun 21, 2024

@eimrek same as #37

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants