Skip to content

Commit

Permalink
Restrict colors to a subset of "brand colors"
Browse files Browse the repository at this point in the history
  • Loading branch information
@ryelle
ryelle committed Sep 5, 2020
1 parent d803f6b commit 7dfe419
Show file tree
Hide file tree
Showing 30 changed files with 1,260 additions and 1,259 deletions.
1 change: 1 addition & 0 deletions src/wp-admin/css/about.css
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/* @no-color-match */
/*------------------------------------------------------------------------------
22.0 - About Pages
Expand Down
44 changes: 22 additions & 22 deletions src/wp-admin/css/admin-menu.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
#adminmenu,
#adminmenu .wp-submenu {
width: 160px;
background-color: #23282d;
background-color: #1d2327;
}

#adminmenuback {
Expand Down Expand Up @@ -47,7 +47,7 @@
/* New Menu icons */

.icon16:before {
color: #82878c; /* same as new icons */
color: #8c8f94; /* same as new icons */
font: normal 20px/1 dashicons;
speak: none;
padding: 6px 0;
Expand Down Expand Up @@ -170,11 +170,11 @@
display: block;
line-height: 1.3;
padding: 2px 5px;
color: #eee;
color: #f6f7f7;
}

#adminmenu .wp-submenu a {
color: #b4b9be;
color: #c3c4c7;
color: rgba(240, 245, 250, 0.7);
font-size: 13px;
line-height: 1.4;
Expand All @@ -191,7 +191,7 @@
#adminmenu li.menu-top > a:focus,
#adminmenu .wp-submenu a:hover,
#adminmenu .wp-submenu a:focus {
color: #00b9eb;
color: #72aee6;
}

#adminmenu li.menu-top {
Expand All @@ -214,7 +214,7 @@
.folded #adminmenu .wp-has-current-submenu .wp-submenu {
padding: 7px 0 8px;
z-index: 9999;
background-color: #32373c;
background-color: #2c3338;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.2);
}

Expand All @@ -239,16 +239,16 @@
border: 0 none;
margin-top: 0;
box-shadow: none;
background-color: #32373c;
background-color: #2c3338;
}

/* ensure that wp-submenu's box shadow doesn't appear on top of the focused menu item's background. */
#adminmenu li.menu-top:hover,
#adminmenu li.opensub > a.menu-top,
#adminmenu li > a.menu-top:focus {
position: relative;
background-color: #191e23;
color: #00b9eb;
background-color: #1d2327;
color: #72aee6;
}

.folded #adminmenu li.menu-top:hover,
Expand All @@ -264,7 +264,7 @@
#adminmenu .wp-menu-arrow,
#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head,
#adminmenu .wp-menu-arrow div {
background: #0073aa;
background: #2271b1;
color: #fff;
}

Expand Down Expand Up @@ -364,14 +364,14 @@
}

div.wp-menu-image:before {
color: #a0a5aa;
color: #a7aaad;
color: rgba(240, 245, 250, 0.6);
padding: 7px 0;
transition: all .1s ease-in-out;
}

#adminmenu div.wp-menu-image:before {
color: #a0a5aa;
color: #a7aaad;
color: rgba(240, 245, 250, 0.6);
}

Expand All @@ -388,7 +388,7 @@ div.wp-menu-image:before {
#adminmenu li:hover div.wp-menu-image:before,
#adminmenu li a:focus div.wp-menu-image:before,
#adminmenu li.opensub div.wp-menu-image:before {
color: #00b9eb;
color: #72aee6;
}

.folded #adminmenu div.wp-menu-image {
Expand Down Expand Up @@ -426,7 +426,7 @@ ul#adminmenu > li.current > a.current:after {
width: 0;
position: absolute;
pointer-events: none;
border-right-color: #f1f1f1;
border-right-color: #f6f7f7;
top: 50%;
margin-top: -8px;
}
Expand Down Expand Up @@ -462,7 +462,7 @@ ul#adminmenu > li.current > a.current:after {
}

#adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after {
border-right-color: #32373c;
border-right-color: #2c3338;
}

#adminmenu li.menu-top:hover .wp-menu-image img,
Expand Down Expand Up @@ -508,7 +508,7 @@ ul#adminmenu > li.current > a.current:after {
min-width: 18px;
height: 18px;
border-radius: 9px;
background-color: #ca4a1f;
background-color: #d63638;
color: #fff;
font-size: 11px;
line-height: 1.6;
Expand All @@ -518,7 +518,7 @@ ul#adminmenu > li.current > a.current:after {

#adminmenu li.current a .awaiting-mod,
#adminmenu li a.wp-has-current-submenu .update-plugins {
background-color: #ca4a1f;
background-color: #d63638;
color: #fff;
}

Expand All @@ -536,16 +536,16 @@ ul#adminmenu > li.current > a.current:after {
position: relative;
overflow: visible;
background: none;
color: #aaa;
color: #a7aaad;
cursor: pointer;
}

#collapse-button:hover {
color: #00b9eb;
color: #72aee6;
}

#collapse-button:focus {
color: #00b9eb;
color: #72aee6;
/* Only visible in Windows High Contrast mode */
outline: 1px solid transparent;
outline-offset: -1px;
Expand Down Expand Up @@ -866,7 +866,7 @@ li#wp-admin-bar-menu-toggle {
}

.wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle a {
background: #32373c;
background: #2c3338;
}

li#wp-admin-bar-menu-toggle {
Expand Down Expand Up @@ -897,7 +897,7 @@ li#wp-admin-bar-menu-toggle {
}

.wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle .ab-icon:before {
color: #00b9eb;
color: #72aee6;
}
}

Expand Down
14 changes: 7 additions & 7 deletions src/wp-admin/css/code-editor.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,25 +34,25 @@
}

.wp-core-ui .CodeMirror-lint-message-warning {
background-color: #fff8e5;
border-left: 4px solid #ffb900;
background-color: #fcf9e8;
border-left: 4px solid #dba617;
}

.wrap .CodeMirror-lint-marker-warning:before,
.wp-core-ui .CodeMirror-lint-message-warning:before {
content: "\f534";
color: #f6a306;
color: #dba617;
}

.wp-core-ui .CodeMirror-lint-message-error {
background-color: #fbeaea;
border-left: 4px solid #dc3232;
background-color: #fcf0f1;
border-left: 4px solid #d63638;
}

.wrap .CodeMirror-lint-marker-error:before,
.wp-core-ui .CodeMirror-lint-message-error:before {
content: "\f153";
color: #dc3232;
color: #d63638;
}

.wp-core-ui .CodeMirror-lint-tooltip {
Expand All @@ -72,5 +72,5 @@
}

.wrap .CodeMirror .CodeMirror-linenumber {
color: #666;
color: #646970;
}
40 changes: 20 additions & 20 deletions src/wp-admin/css/color-picker.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,10 @@
}

.wp-color-result-text {
background: #f7f7f7;
background: #f6f7f7;
border-radius: 0 2px 2px 0;
border-left: 1px solid #ccc;
color: #555;
border-left: 1px solid #c3c4c7;
color: #50575e;
display: block;
line-height: 2.54545455; /* 28px */
padding: 0 6px;
Expand All @@ -29,24 +29,24 @@

.wp-color-result:hover,
.wp-color-result:focus {
background: #fafafa;
border-color: #999;
color: #23282d;
background: #f6f7f7;
border-color: #8c8f94;
color: #1d2327;
}

.wp-color-result:hover:after,
.wp-color-result:focus:after {
color: #23282d;
border-color: #a0a5aa;
border-left: 1px solid #999;
color: #1d2327;
border-color: #a7aaad;
border-left: 1px solid #8c8f94;
}

.wp-picker-container {
display: inline-block;
}

.wp-color-result:focus {
border-color: #5b9dd9;
border-color: #4f94d4;
box-shadow: 0 0 3px rgba(0, 115, 170, 0.8);
}

Expand Down Expand Up @@ -81,12 +81,12 @@
}

.wp-picker-container .iris-square-slider .ui-slider-handle:focus {
background-color: #555
background-color: #50575e
}

.wp-picker-container .iris-picker {
border-radius: 0;
border-color: #ddd;
border-color: #dcdcde;
margin-top: 6px;
}

Expand All @@ -102,34 +102,34 @@
}

.wp-color-picker::-webkit-input-placeholder {
color: #72777c;
color: #787c82;
}

.wp-color-picker::-moz-placeholder {
color: #72777c;
color: #787c82;
opacity: 1;
}

.wp-color-picker:-ms-input-placeholder {
color: #72777c;
color: #787c82;
}

.wp-picker-container input[type="text"].iris-error {
background-color: #ffebe8;
border-color: #c00;
background-color: #fcf0f1;
border-color: #d63638;
color: #000;
}

.iris-picker .ui-square-handle:focus,
.iris-picker .iris-strip .ui-slider-handle:focus {
border-color: #007cba;
border-color: #3582c4;
border-style: solid;
box-shadow: 0 0 0 1px #007cba;
box-shadow: 0 0 0 1px #3582c4;
outline: 2px solid transparent;
}

.iris-picker .iris-palette:focus {
box-shadow: 0 0 0 2px #007cba;
box-shadow: 0 0 0 2px #3582c4;
}

@media screen and (max-width: 782px) {
Expand Down
Loading

0 comments on commit 7dfe419

Please sign in to comment.