Changeset 37231

Timestamp:

04/17/2016 04:57:54 PM (9 years ago)

Author:

afercia

Message:

Accessibility: change the close "X" in the Media "Attach to existing content" modal in a button.

Props joedolson.

Fixes #36554.

Location:

trunk/src/wp-admin

Files:

• css/media.css (modified) (2 diffs)
• includes/template.php (modified) (1 diff)

trunk/src/wp-admin/css/media.css

@@ -303 +303 @@
     width: 36px;
     height: 36px;
+    border: none;
+    padding: 0;
     position: absolute;
     top: 0;
@@ -308 +310 @@
     cursor: pointer;
     text-align: center;
+    background: none;
     color: #666;
 }
 
-#find-posts-close:hover {
+#find-posts-close:hover,
+#find-posts-close:focus {
     color: #00a0d2;
+}
+
+#find-posts-close:focus {
+    outline: none;
+    -webkit-box-shadow:
+        0 0 0 1px #5b9dd9,
+        0 0 2px 1px rgba(30, 140, 190, .8);
+    box-shadow:
+        0 0 0 1px #5b9dd9,
+        0 0 2px 1px rgba(30, 140, 190, .8);
 }
 

trunk/src/wp-admin/includes/template.php

@@ -1487 +1487 @@
         <div id="find-posts-head" class="find-box-head">
             <?php _e( 'Attach to existing content' ); ?>
-            <div id="find-posts-close"></div>
+            <button type="button" id="find-posts-close"><span class="screen-reader-text"><?php _e( 'Close media attachment panel' ); ?></button>
         </div>
         <div class="find-box-inside">