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

explorer: add dark theme #1979

Merged
merged 2 commits into from
Jul 22, 2024
Merged

explorer: add dark theme #1979

merged 2 commits into from
Jul 22, 2024

Conversation

deuch13
Copy link
Contributor

@deuch13 deuch13 commented Jul 16, 2024

Resolves #1978

@deuch13 deuch13 added the module:explorer Issues related to explorer module label Jul 16, 2024
@nortonandreev
Copy link
Contributor

Feedback on Button Variants and Theming:

The button variant should stay consistent across themes, with only the appearance changing in dark mode. This maintains semantic meaning, simplifies the code, and ensures a consistent user experience. Use CSS variables to adjust the appearance, like in the wallet application where --control-bg-color changes from --smokey-black in light mode to --light-grey in dark mode. This approach keeps the UI clear and maintainable.

@nortonandreev
Copy link
Contributor

Screen.Recording.2024-07-17.at.12.43.46.mov

I have a feeling that the hover state should be something else? 👀

@deuch13 deuch13 force-pushed the feature-1978 branch 3 times, most recently from fef33b3 to 46cb763 Compare July 22, 2024 14:23
@deuch13 deuch13 marked this pull request as ready for review July 22, 2024 14:24
@deuch13
Copy link
Contributor Author

deuch13 commented Jul 22, 2024

Screen.Recording.2024-07-17.at.12.43.46.mov
I have a feeling that the hover state should be something else? 👀

I've addressed this by bringing in the design we currently have in the wallet.

@deuch13
Copy link
Contributor Author

deuch13 commented Jul 22, 2024

Feedback on Button Variants and Theming:

The button variant should stay consistent across themes, with only the appearance changing in dark mode. This maintains semantic meaning, simplifies the code, and ensures a consistent user experience. Use CSS variables to adjust the appearance, like in the wallet application where --control-bg-color changes from --smokey-black in light mode to --light-grey in dark mode. This approach keeps the UI clear and maintainable.

Agreed, this has been fixed by bringing in the update button and language css from the wallet app.

Copy link
Member

@kieranhall kieranhall left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@deuch13 deuch13 merged commit 3e8a7ca into master Jul 22, 2024
8 checks passed
@deuch13 deuch13 deleted the feature-1978 branch July 22, 2024 16:12
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
module:explorer Issues related to explorer module
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add dark theme
4 participants