Skip to content

feat: add light theme #11266

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

Merged
merged 21 commits into from
Dec 20, 2023
Merged

feat: add light theme #11266

merged 21 commits into from
Dec 20, 2023

Conversation

aslilac
Copy link
Member

@aslilac aslilac commented Dec 18, 2023

Screenshot 2023-12-14 at 3 46 31 PM Screenshot 2023-12-14 at 3 46 43 PM

Copy link

github-actions bot commented Dec 18, 2023


✔️ PR 11266 Updated successfully.
🚀 Access the credentials here.

cc: @aslilac

Copy link
Collaborator

@BrunoQuaresma BrunoQuaresma left a comment

Choose a reason for hiding this comment

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

Overall the code looks good! Is there any place you think we should be more careful in the review? I'm going to run it locally to do some QA.

@BrunoQuaresma

This comment was marked as resolved.

@aslilac
Copy link
Member Author

aslilac commented Dec 18, 2023

yeah, buttons have always had a shadow, it's just not very noticeable because of the dark background. I like the shadow a lot more than without, because otherwise you need a darker border which doesn't look very good imo.

Copy link
Collaborator

@BrunoQuaresma BrunoQuaresma left a comment

Choose a reason for hiding this comment

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

I found a few more issues:

  1. The loading spinner in the workspace status badge and template editor build status badge are white.
Screenshot 2023-12-19 at 10 52 34
  1. The contrast of the agent metadata is low
Screenshot 2023-12-19 at 10 49 34
  1. The icon of the GitHub button is white
Screenshot 2023-12-19 at 10 48 58
  1. The default icons in the app usage panel, on the template insights page are white
Screenshot 2023-12-19 at 10 48 41
  1. The template source files theme colors have a low contrast
Screenshot 2023-12-19 at 10 48 09
  1. The role badge, on the users page has a dark text on a dark background
Screenshot 2023-12-19 at 10 47 25
  1. When a pagination item is active, it has a dark text on dark background
Screenshot 2023-12-19 at 10 47 06
  1. The menu item on hover does not apply a different/contrast background
Screenshot 2023-12-19 at 10 46 19
  1. The help tooltip links have a low contrast
Screenshot 2023-12-19 at 10 46 09
  1. The rocket icon in the deployment bottom bar is white
Screenshot 2023-12-19 at 10 45 48

@bpmct
Copy link
Member

bpmct commented Dec 19, 2023

Looking awesome! Some feedback:


The contrast seems too light here

image

in comparison here's the contrast for the dark theme

image


Same with the create workspace button IMO

image

versus

image

in this case, it felt like I was "discovering" the button in the light mode (like where's waldo) where my eyes were drawn to it in the dark one


Should this be red?

image


should this be green?

image


should this be red?

image


this blue is a bit jarring. perhaps if the "create workspace" was blue it wouldn't be

image


audit log diffs seem quite jarring too since the rest of ui has minimal constrast

image


@matifali
Copy link
Member

Users Table
Screenshot 2023-12-19 at 7 33 39 PM
Groups:
image

@matifali
Copy link
Member

I suggest we make the Green more greener. It will help improve the contrast for agent metadata and the health page.
Screenshot 2023-12-19 at 7 37 10 PM

@aslilac aslilac merged commit 97f7a35 into main Dec 20, 2023
@aslilac aslilac deleted the light-theme branch December 20, 2023 00:03
@github-actions github-actions bot locked and limited conversation to collaborators Dec 20, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants