Changeset 60637

Timestamp:

08/14/2025 11:06:45 PM (4 months ago)

Author:

joedolson

Message:

Media: Fix button focus visibility in media uploads.

Following [r58279], the focus outline on the Edit button after uploading media was partially cut off. Adjust margin and padding to ensure the outline is visible, while also supporting appropriate word wrapping on long file names.

Props dilipbheda, karthikeya01, sabernhardt, narenin, zunaid321, Marius84, ankitkumarshah, riddhidave, dilip2615, SirLouen, Presskopp, joedolson.
Fixes #63239.

Location:

trunk/src/wp-admin

Files:

• async-upload.php (modified) (1 diff)
• css/media.css (modified) (1 diff)

trunk/src/wp-admin/async-upload.php

@@ -61 +61 @@
                     ?>
                     <div class="filename new">
-                        <span class="media-list-title"><strong><?php echo esc_html( wp_html_excerpt( $title, 60, '&hellip;' ) ); ?></strong></span>
-                        <span class="media-list-subtitle"><?php echo esc_html( wp_basename( $file ) ); ?></span>
+                        <span class="media-list-title word-wrap-break-word"><strong><?php echo esc_html( wp_html_excerpt( $title, 60, '&hellip;' ) ); ?></strong></span>
+                        <span class="media-list-subtitle word-wrap-break-word"><?php echo esc_html( wp_basename( $file ) ); ?></span>
                         <div class="attachment-tools">
                             <?php

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

@@ -168 +168 @@
 
 .media-item .filename {
-    padding: 14px 0;
+    padding: 14px 2px;
     overflow: hidden;
-    margin-left: 6px;
+    margin-left: 4px;
 }