Ticket #39983: 39983.diff

src/wp-includes/css/media-views.css

@@ -183 +183 @@
         right: 0;
         width: 50px;
         height: 50px;
+        margin: 0;
         padding: 0;
+        border: 1px solid transparent;
+        background: none;
+        color: #666;
         z-index: 1000;
+        cursor: pointer;
+        outline: none;
         -webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
         transition: color .1s ease-in-out, background .1s ease-in-out;
 }
 
-.media-modal-close.button-link {
-        text-decoration: none;
+.media-modal-close:hover,
+.media-modal-close:active {
+        color: #00a0d2;
 }
 
-.media-modal-close:active {
-        -webkit-box-shadow: none;
-        box-shadow: none;
+.media-modal-close:focus {
+        color: #00a0d2;
+        border-color: #5b9dd9;
+        -webkit-box-shadow: 0 0 3px rgba( 0, 115, 170, .8 );
+        box-shadow: 0 0 3px rgba( 0, 115, 170, .8 );
 }
 
 .media-modal-close span.media-modal-icon {
@@ -209 +218 @@
         vertical-align: middle;
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;
-        color: #666;
 }
 
-.media-modal-close:hover .media-modal-icon:before {
-        color: #00a0d2;
-}
-
-.media-modal-close:active {
-        outline: 0;
-}
-
 .media-modal-content {
         position: absolute;
         top: 0;

src/wp-includes/media-template.php

@@ -163 +163 @@
 
         <script type="text/html" id="tmpl-media-modal">
                 <div class="<?php echo $class; ?>">
-                        <button type="button" class="button-link media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close media panel' ); ?></span></span></button>
+                        <button type="button" class="media-modal-close"><span class="media-modal-icon"><span class="screen-reader-text"><?php _e( 'Close media panel' ); ?></span></span></button>
                         <div class="media-modal-content"></div>
                 </div>
                 <div class="media-modal-backdrop"></div>