Skip to content

Theme color improvements#37953

Merged
mdo merged 4 commits intomainfrom
theme-color-improvements
Jan 26, 2023
Merged

Theme color improvements#37953
mdo merged 4 commits intomainfrom
theme-color-improvements

Conversation

@mdo
Copy link
Copy Markdown
Member

@mdo mdo commented Jan 25, 2023

This PR revamps our new text emphasis, subtle border color, and subtle background colors. Instead of manually using specific darker or lighter shades (e.g., $blue-300 for subtle primary border), they're now generated based on theme colors using the existing tint-color() and shade-color(). This is the more sensible approach given feedback in #37949.

This purposely avoids touching the grays for now—too annoying to tweak right now. Down the line in v6, I think we can revamp some theme colors, too:

  • Change meaning of $secondary to allow for new body-secondary and body-tertiary approach in our CSS vars and utilities.
  • Add an accent color that complements primary.
  • Add emphasis and inverse buttons to replace light and dark.

Might be more coming for that as well.

Fixes #37949.

@mdo mdo marked this pull request as ready for review January 25, 2023 21:47
@mdo mdo requested a review from a team as a code owner January 25, 2023 21:47
@mdo mdo merged commit 82391bc into main Jan 26, 2023
@mdo mdo deleted the theme-color-improvements branch January 26, 2023 02:11
@mahilanmjd mahilanmjd mentioned this pull request Apr 16, 2023
6 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

No open projects
Status: Done

Development

Successfully merging this pull request may close these issues.

Dark mode's derived variables should reference the variables they are based on, not the defaults

1 participant