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

Use only colors from suggested gruvbox palettes #1176

Merged
merged 2 commits into from
Mar 31, 2022

Conversation

neiljp
Copy link
Collaborator

@neiljp neiljp commented Mar 23, 2022

What does this PR do?

When the light variant was added, we noticed that the gruvbox palettes have the faded/neutral/bright variants of colors, and it was suggested to group these.

It is noticeable in the palettes linked below that:

  • dark uses bright+neutral colors
  • light uses faded+neutral colors

The existing dark variant uses some faded colors, and the light variant seems to use some bright ones. This PR is intended to address these issues, and group colors to make this usage clearer.

https://github.com/morhetz/gruvbox#palette

Tested?

  • Manually
  • Existing tests (adapted, if necessary)
  • New tests added (for any new behavior)
  • Passed linting & tests (each commit)

Commit flow

  • Update dark mode, and label/group used color palette elements
  • Update light mode, and label/group remaining color palette elements

Notes & Questions

The term 'mode' is used in the color palette comments, based on the gruvbox terminology.

Visual changes

Please do fetch this PR for comparison, as colors can look differently in local systems.

Main elements that changed: (as evident in the diff) <-- DARK MODE

  • selected elements: light-on-faded-blue -> dark-on-neutral-blue
  • general narrow titles (PMs, mentions, ...): light-on-faded-blue -> dark-on-bright-blue
  • quotes: faded-yellow-on-dark -> neutral-yellow-on-dark
  • area:error/task:error: light-on-faded-red -> dark-on-bright-red
  • area:msg: dark-on-bright-red (ok!) -> dark-on-neutral-purple (avoid area:error conflict)
  • task:warning: dark-on-bright-red (ok!) -> dark-on-neutral-purple (avoid task:error conflict)
  • area:user (user info): light-on-faded-blue -> dark-on-bright-yellow (bright blue already used for streams)

@zulipbot zulipbot added the size: S [Automatic label added by zulipbot] label Mar 23, 2022
@neiljp neiljp force-pushed the 2022-03-22-gruvbox-tidying branch from 16f4dd4 to 53a6979 Compare March 27, 2022 07:01
@zulipbot zulipbot added size: L [Automatic label added by zulipbot] and removed size: S [Automatic label added by zulipbot] labels Mar 27, 2022
@neiljp
Copy link
Collaborator Author

neiljp commented Mar 27, 2022

I've just made a preliminary equivalent set of changes for the light version.

I'm incrementally rearranging the color ordering/grouping as this happens.

There are still some overlapping colors which I'd like to avoid in both dark and light from these changes.

According to the official gruvbox style, FADED_* colors should not
appear in the dark mode, so this commit adjusts FADED to BRIGHT or
NEUTRAL versions. Ref: https://github.com/morhetz/gruvbox#palette

In order to improve contrast if it is a background change, the
foreground is shifted from standard foreground (LIGHT2) to the inverse
(background), ie. DARK0_HARD.

To improve variation & avoid confusion, some more specific hues are used:
- background NEUTRAL_BLUE is used for all selections (from FADED_BLUE)
- background BRIGHT_BLUE is used for general narrows (from FADED_BLUE)
- background BRIGHT_YELLOW is used for area:user (from FADED_BLUE)
  (saving BRIGHT_BLUE for area:stream)
- background NEUTRAL_PURPLE is used for area:msg (from BRIGHT_RED)
  (saving BRIGHT_RED for area:error)
- background NEUTRAL_PURPLE is used for task:warning (from BRIGHT_RED)
  (saving BRIGHT_RED for task:error)

Colors reordered in colors_gruvbox.py accordingly.
According to the official gruvbox style, BRIGHT_* colors should not
appear in the light mode, so this commit adjusts BRIGHT to FADED or
NEUTRAL versions. Ref: https://github.com/morhetz/gruvbox#palette

In order to improve contrast if it is a background change, the
foreground is shifted from standard foreground (DARK2) to the inverse
(background), ie. LIGHT0_HARD.

To improve variation & avoid confusion, some more specific hues are used:
- background NEUTRAL_BLUE is used for all selections (from BRIGHT_BLUE)
- background FADED_BLUE is used for general narrows (from BRIGHT_BLUE)
- background FADED_YELLOW is used for area:user (from BRIGHT_BLUE)
  (saving FADED_BLUE for area:stream)
- background NEUTRAL_PURPLE is used for area:msg (from FADED_RED)
  (saving FADED_RED for area:error)
- background NEUTRAL_PURPLE is used for task:warning (from FADED_RED)
  (saving FADED_RED for task:error)

Colors reordered in colors_gruvbox.py accordingly.
@neiljp neiljp force-pushed the 2022-03-22-gruvbox-tidying branch from 53a6979 to 84a1cc8 Compare March 29, 2022 00:09
@neiljp neiljp changed the title [WIP] Use only colors from suggested gruvbox palettes Use only colors from suggested gruvbox palettes Mar 29, 2022
@neiljp neiljp force-pushed the 2022-03-22-gruvbox-tidying branch from 84a1cc8 to 3be7509 Compare March 29, 2022 00:11
@neiljp neiljp added this to the Next Release milestone Mar 29, 2022
@neiljp
Copy link
Collaborator Author

neiljp commented Mar 29, 2022

This should be the final version to review now.

Changes since the 2nd iteration are:

  • improve comments in the colors file
  • use purples for some styles that otherwise didn't need to change, but avoid confusion/conflict with other styles in the same area (task:*, area:*)

@Dishti-Oberai
Copy link
Collaborator

Dishti-Oberai commented Mar 29, 2022

I find the changes good enough!

@neiljp neiljp merged commit bd05df7 into zulip:main Mar 31, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants