Changeset 46359

Timestamp:

09/30/2019 05:55:07 PM (5 years ago)

Author:

antpb

Message:

Media: Prevents clipping of text when scaling image edit screen.

This reapplies [46354] clean as the previous commit had remnants of an unrelated patch.

Props sabernhardt, audrasjb, afercia.
See #47115.

Location:

trunk/src

Files:

• wp-admin/css/edit.css (modified) (1 diff)
• wp-admin/css/media.css (modified) (2 diffs)
• wp-admin/includes/image-edit.php (modified) (2 diffs)
• wp-admin/includes/media.php (modified) (1 diff)
• wp-includes/css/editor.css (modified) (1 diff)

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

@@ -651 +651 @@
 .edit-form-section {
     margin-bottom: 20px;
+}
+
+.wp_attachment_details .attachment-content-description {
+    margin-top: 0.5385em;
+    display: inline-block;
+    min-height: 1.6923em;
 }
 

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

@@ -1115 +1115 @@
 }
 
+.imgedit-settings .imgedit-original-dimensions {
+    display: inline-block;
+}
+
 .imgedit-settings .imgedit-scale input[type="text"],
 .imgedit-settings .imgedit-crop-ratio input[type="text"],
 .imgedit-settings .imgedit-crop-sel input[type="text"] {
-    width: 50px;
+    width: 80px;
     font-size: 14px;
     padding: 5px 8px;
@@ -1129 +1133 @@
     font-size: 13px;
     color: #444;
+}
+
+.imgedit-settings .imgedit-scale-button-wrapper {
+    margin-top: 0.3077em;
+    display: block;
 }
 

trunk/src/wp-admin/includes/image-edit.php

@@ -63 +63 @@
                 /* translators: %s: Image width and height in pixels. */
                 __( 'Original dimensions %s' ),
-                $meta['width'] . ' × ' . $meta['height']
+                '<span class="imgedit-original-dimensions">' . $meta['width'] . ' &times; ' . $meta['height'] . '</span>'
             );
             ?>
@@ -79 +79 @@
         <input type="text" id="imgedit-scale-height-<?php echo $post_id; ?>" onkeyup="imageEdit.scaleChanged(<?php echo $post_id; ?>, 0, this)" onblur="imageEdit.scaleChanged(<?php echo $post_id; ?>, 0, this)" value="<?php echo isset( $meta['height'] ) ? $meta['height'] : 0; ?>" />
         <span class="imgedit-scale-warn" id="imgedit-scale-warn-<?php echo $post_id; ?>">!</span>
-        <input id="imgedit-scale-button" type="button" onclick="imageEdit.action(<?php echo "$post_id, '$nonce'"; ?>, 'scale')" class="button button-primary" value="<?php esc_attr_e( 'Scale' ); ?>" />
+        <div class="imgedit-scale-button-wrapper"><input id="imgedit-scale-button" type="button" onclick="imageEdit.action(<?php echo "$post_id, '$nonce'"; ?>, 'scale')" class="button button-primary" value="<?php esc_attr_e( 'Scale' ); ?>" /></div>
         </div>
         </fieldset>

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

@@ -3208 +3208 @@
     ?>
 
-    <label for="attachment_content"><strong><?php _e( 'Description' ); ?></strong>
+    <label for="attachment_content" class="attachment-content-description"><strong><?php _e( 'Description' ); ?></strong>
     <?php
 

trunk/src/wp-includes/css/editor.css

@@ -1323 +1323 @@
         /* .button-small is normally 11px, but a bit too small for these buttons. */
         font-size: 12px;
-        height: 26px;
+        min-height: 26px;
         line-height: 2;
     }