Ticket #34904: 34904.15.diff

src/wp-admin/css/colors/_admin.scss

@@ -28 +28 @@
 .curtime #timestamp:before,
 #post-body .misc-pub-revisions:before,
 span.wp-media-buttons-icon:before {
-        color: $link-focus;
+        color: currentColor;
 }
 
 
@@ -99 +99 @@
                 box-shadow: 0 0 0 1px $button-color;
         }
 
+        .button:active {
+                background: darken( $button-color, 5% );
+                border-color: darken( $button-color, 5% );
+        }
+
+        .button.active,
+        .button.active:focus,
+        .button.active:hover {
+                border-color: darken( $button-color, 5% );
+                color: darken( $button-color, 5% );
+                box-shadow: inset 0 2px 5px -3px darken( $button-color, 5% );
+        }
+
         .button-primary {
                 @include button( $button-color );
         }

src/wp-admin/css/colors/_mixins.scss

@@ -20 +20 @@
                         0 0 0 3px $button-color;
         }
 
-        &:active,
+        &:active {
+                background: darken( $button-color, 5% );
+                border-color: darken( $button-color, 5% );
+                color: $text-color;
+        }
+
         &.active,
         &.active:focus,
         &.active:hover {
-                background: darken( $button-color, 5% );
-                border-color: darken( $button-color, 5% );
+                background: $button-color;
+                color: $text-color;
+                border-color: darken( $button-color, 15% );
+                box-shadow: inset 0 2px 5px -3px darken( $button-color, 50% );
         }
 
         &[disabled],

src/wp-includes/css/buttons.css

@@ -146 +146 @@
         outline-offset: 0;
 }
 
-.wp-core-ui .button.active,
-.wp-core-ui .button.active:hover,
+/* :active state */
 .wp-core-ui .button:active,
 .wp-core-ui .button-secondary:active {
         background: #f3f5f6;
@@ -155 +154 @@
         box-shadow: none;
 }
 
+/* pressed state e.g. a selected setting */
+.wp-core-ui .button.active,
+.wp-core-ui .button.active:hover {
+        background-color: #e2e4e7;
+        color: #00669b;
+        border-color: #016087;
+        box-shadow: inset 0 2px 5px -3px #016087;
+}
+
 .wp-core-ui .button.active:focus {
-        border-color: #7e8993;
-        box-shadow: 0 0 0 1px #7e8993;
+        border-color: #007cba;
+        box-shadow:
+                inset 0 2px 5px -3px #016087,
+                0 0 0 1px #007cba;
 }
 
 .wp-core-ui .button[disabled],
@@ -258 +268 @@
         background: #00669b;
         border-color: #00669b;
         box-shadow: none;
+        color: #fff;
 }
 
 .wp-core-ui .button-primary[disabled],
@@ -307 +318 @@
         z-index: 1;
 }
 
+/* pressed state e.g. a selected setting */
 .wp-core-ui .button-group > .button.active {
         background-color: #e2e4e7;
-        box-shadow: inset 0 1px 0 0 #999;
+        color: #00669b;
         border-color: #016087;
+        box-shadow: inset 0 2px 5px -3px #016087;
 }
 
+.wp-core-ui .button-group > .button.active:focus {
+        border-color: #007cba;
+        box-shadow:
+                inset 0 2px 5px -3px #016087,
+                0 0 0 1px #007cba;
+}
+
 /* ----------------------------------------------------------------------------
   5.0 - Responsive Button Styles
 ---------------------------------------------------------------------------- */