Skip to content

CSS: Reduce colors used in wp-admin#818

Closed
ryelle wants to merge 3 commits into
WordPress:masterfrom
ryelle:update/reduce-colors
Closed

CSS: Reduce colors used in wp-admin#818
ryelle wants to merge 3 commits into
WordPress:masterfrom
ryelle:update/reduce-colors

Conversation

@ryelle

@ryelle ryelle commented Dec 15, 2020

Copy link
Copy Markdown
Contributor

This is part of a longer project in cleaning up core's admin CSS; eventually making color schemes easier and a dark mode possible. It collapses all colors used in the CSS to one of the colors listed in this color palette.

In the short-term, it also visually cleans up the admin, and should help any newer projects make design decisions with consistency.

The process was initially automated, with some very basic manual cleanup, so it should be visually checked for contrast and if anything's off with the design.

See some before & after screenshots here.

This brings down the total number of colors used in core CSS down to 97 unique values (from 258 ❗ ).

Trac ticket: https://core.trac.wordpress.org/ticket/49999


This Pull Request is for code review only. Please keep all other discussion in the Trac ticket. Do not merge this Pull Request. See GitHub Pull Requests for Code Review in the Core Handbook for more details.

@ryelle ryelle self-assigned this Dec 15, 2020
Comment thread src/wp-admin/css/about.css Outdated
@@ -1,3 +1,4 @@
/* @no-color-match */

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

This is just for the automated replacement tool, it should be removed before this is merged.

@danfarrow

Copy link
Copy Markdown

The "back to the PR" link on the before & after page doesn't have an href attribute, I just noticed

@ryelle

ryelle commented Dec 21, 2020

Copy link
Copy Markdown
Contributor Author

@danfarrow Thanks for catching that— I put up the page before the PR was created, and forgot to update it.

@ryelle ryelle force-pushed the update/reduce-colors branch from 4260e44 to cffbb5d Compare January 12, 2021 23:59
@ryelle ryelle force-pushed the update/reduce-colors branch from cffbb5d to c385a73 Compare January 21, 2021 17:15
@ryelle

ryelle commented Jan 21, 2021

Copy link
Copy Markdown
Contributor Author

Based on feedback on the ticket, I've added another valid grey, #f0f0f1, to be used as the page background color.

Screen Shot 2021-01-21 at 12 16 53 PM

Screen Shot 2021-01-21 at 12 17 11 PM

@ryelle

ryelle commented Jan 28, 2021

Copy link
Copy Markdown
Contributor Author

Merged in [50025]

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.

2 participants