Accessibility: Improve the color contrast ratio of the expandable panel "handles".

Fixes #35923.

git-svn-id: https://develop.svn.wordpress.org/trunk@36959 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-admin/css/common.css

@@ -1561,7 +1561,7 @@ form.upgrade .hint {
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 	text-decoration: none !important;
-	color: #b4b9be;
+	color: #72777c;
 }
 
 #screen-meta-links .screen-meta-active:after {
@@ -3055,21 +3055,26 @@ img {
 	text-decoration: none !important;
 }
 
-.widget-action,
 .handlediv,
 .item-edit,
 .sidebar-name-arrow,
 .accordion-section-title:after {
-	color: #a0a5aa;
+	color: #72777c;
 }
 
-.widget-action:hover,
+.widget-action {
+	color: #555d66; /* #fafafa background in the Widgets screen */
+}
+
+.widget-top:hover .widget-action,
+.widget-action:focus,
 .handlediv:hover,
 .handlediv:focus,
 .item-edit:hover,
+.item-edit:focus,
 .sidebar-name:hover .sidebar-name-arrow,
 .accordion-section-title:hover:after {
-	color: #555d66;
+	color: #23282d;
 }
 
 .widget-top a.widget-action:after {

src/wp-admin/css/customize-controls.css

@@ -159,6 +159,7 @@ body {
 
 #customize-theme-controls .accordion-section-title:after {
 	content: "\f345";
+	color: #a0a5aa;
 }
 
 #customize-theme-controls .accordion-section-content {
@@ -646,6 +647,7 @@ p.customize-section-description {
 	user-select: none;
 }
 
+/* @todo maybe no more used? */
 .customize-control .dropdown-arrow {
 	position: absolute;
 	top: 0;

src/wp-admin/css/customize-nav-menus.css

@@ -263,7 +263,7 @@
 	vertical-align: top;
 	-webkit-border-radius: 50%;
 	border-radius: 50%;
-	color: #a0a5aa;
+	color: #72777c;
 	font: normal 20px/1 dashicons;
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
@@ -468,12 +468,15 @@
 	content: none !important;
 }
 
-#available-menu-items .accordion-section-title:hover .toggle-indicator:after {
-	color: #555d66;
+#available-menu-items .accordion-section-title:hover .toggle-indicator:after,
+#available-menu-items .button-link:hover .toggle-indicator:after,
+#available-menu-items .button-link:focus .toggle-indicator:after {
+	color: #23282d;
 }
 
 #available-menu-items .open .accordion-section-title .toggle-indicator:after {
 	content: "\f142";
+	color: #23282d;
 }
 
 #available-menu-items .accordion-section-content {

src/wp-admin/css/customize-widgets.css

@@ -19,10 +19,20 @@
 }
 
 .customize-control-widget_form .widget-top {
+	background: #fff;
 	-webkit-transition: opacity 0.5s;
 	transition: opacity 0.5s;
 }
 
+.customize-control .widget-action {
+	color: #72777c;
+}
+
+.customize-control .widget-top:hover .widget-action,
+.customize-control .widget-action:focus {
+	color: #23282d;
+}
+
 .customize-control-widget_form:not(.widget-rendered) .widget-top {
 	opacity: 0.5;
 }

src/wp-admin/css/list-tables.css

@@ -536,7 +536,7 @@ th.asc a:focus span.sorting-indicator:before {
 	border-radius: 50%;
 	display: block;
 	padding: 1px 2px 1px 0;
-	color: #666;
+	color: #444; /* same as table headers sort arrows */
 	content: "\f140";
 	font: normal 20px/1 dashicons;
 	line-height: 1;