Changeset 47418 for trunk

Timestamp:

03/03/2020 05:19:55 PM (7 years ago)

Author:

SergeyBiryukov

Message:

Media: Improve the appearance of image editor on small and medium screens.

This prevents the main area of Edit Media screen from being pushed down too far.

Props sabernhardt, afercia, fierevere, sathyapulse, mikeschroder, johnbillion.
Fixes #48780. See #47136.

Location:

trunk/src/wp-admin/css

Files:

• edit.css (modified) (1 diff)
• media.css (modified) (2 diffs)

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

@@ -1429 +1429 @@
 }
 
+/* one column on the attachment editor screen */
+@media only screen and (max-width: 1200px) {
+        .post-type-attachment #poststuff {
+                min-width: 0;
+        }
+
+        .post-type-attachment #wpbody-content #poststuff #post-body {
+                margin: 0;
+        }
+
+        .post-type-attachment #wpbody-content #post-body.columns-2 #postbox-container-1 {
+                margin-right: 0;
+                width: 100%;
+        }
+
+        .post-type-attachment #poststuff #postbox-container-1 .empty-container,
+        .post-type-attachment #poststuff #postbox-container-1 #side-sortables:empty {
+                border: 0 none;
+                height: 0;
+                min-height: 0;
+        }
+
+        .post-type-attachment #poststuff #post-body.columns-2 #side-sortables {
+                min-height: 0;
+                width: auto;
+        }
+
+        /* hide the radio buttons for column prefs */
+        .post-type-attachment .screen-layout,
+        .post-type-attachment .columns-prefs {
+                display: none;
+        }
+}
+
 /* one column on the post write/edit screen */
 @media only screen and (max-width: 850px) {

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

@@ -853 +853 @@
         float: left;
         padding: 3px 16px 0 0;
+        min-width: 400px;
+        max-width: calc( 100% - 266px );
 }
 
@@ -1212 +1214 @@
                 float: none;
                 width: auto;
+                max-width: none;
         }
 }