Changeset 62090

Timestamp:

03/22/2026 11:13:09 PM (7 weeks ago)

Author:

joedolson

Message:

Administration: Fix alignment in upload plugin/theme buttons.

Following [61598], the upload button for plugins and themes could cover the file information in the file input for longer internationalized strings due to absolute positioning.

Update layout to use remove absolute positioning while retaining the larger drop area.

Props audrasjb, pratiknawkar94, huzaifaalmesbah, noruzzaman, presskopp, joedolson.
Fixes #64832.

File:

• trunk/src/wp-admin/css/themes.css (modified) (2 diffs)

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

@@ -1137 +1137 @@
 .upload-plugin .wp-upload-form {
     position: relative;
-    margin: 30px auto;
+    margin: 30px;
     display: inline-flex;
     justify-content: space-between;
     align-items: center;
+    border: 1px solid #c3c4c7;
+    background: #f6f7f7;
 }
 
 .upload-theme .wp-upload-form input[type="file"],
 .upload-plugin .wp-upload-form input[type="file"] {
-    background: #f6f7f7;
-    border: 1px solid #c3c4c7;
+    background: transparent;
     margin: 0;
-    padding: 30px 128px 30px 30px;
-}
-
-.upload-plugin .wp-upload-form input[type=submit],
-.upload-theme .wp-upload-form input[type=submit] {
-    position: absolute;
-    right: 30px;
+    padding: 30px 0 30px 30px;
+}
+
+.wp-upload-form input[type="submit"].button {
+    margin-right: 30px;
 }
 
@@ -2072 +2071 @@
     .upload-theme .wp-upload-form {
         width: 100%;
+        box-sizing: border-box;
     }
 
     .upload-plugin .wp-upload-form input[type=file],
     .upload-theme .wp-upload-form input[type=file] {
-        padding: 30px 30px 80px;
+        padding: 30px 0 30px 30px;
         width: 100%;
     }
-
-    :is(.upload-theme, .upload-plugin) .wp-upload-form input[type="submit"].button {
-        right: unset;
-        left: 50%;
-        transform: translateX(-50%) !important;
-        top: calc( 1.4em + 42px ); /* Line height of control + gap + top padding. */
-        margin: 10px 0 0;
-    }
-}
+}