From b5ca4cc9c33f2a090a3fd4da0909af98ea738a04 Mon Sep 17 00:00:00 2001 From: Pascal Birchler Date: Fri, 14 Apr 2017 09:30:37 +0000 Subject: [PATCH] Media: Ensure Crop Image is always visible. Previously, the crop button in the media modal after uploading header images or similar was hidden and the task could not be completed. Props karinedo, sagarprajapati, Cybr, mayurk. Fixes #40152. git-svn-id: https://develop.svn.wordpress.org/trunk@40428 602fd350-edb4-49c9-b593-d223f7449a82 --- src/wp-includes/css/buttons.css | 5 +++++ src/wp-includes/css/media-views.css | 25 ++++++++++++++++--------- 2 files changed, 21 insertions(+), 9 deletions(-) diff --git a/src/wp-includes/css/buttons.css b/src/wp-includes/css/buttons.css index 1a614cb9ee..2410b9208c 100644 --- a/src/wp-includes/css/buttons.css +++ b/src/wp-includes/css/buttons.css @@ -411,6 +411,11 @@ TABLE OF CONTENTS: vertical-align: inherit; } + .media-modal-content .media-toolbar-primary .media-button { + margin-top: 10px; + margin-left: 5px; + } + /* Reset responsive styles on Log in button on iframed login form */ .interim-login .button.button-large { diff --git a/src/wp-includes/css/media-views.css b/src/wp-includes/css/media-views.css index 698ea2d525..0c0bd6dfd2 100644 --- a/src/wp-includes/css/media-views.css +++ b/src/wp-includes/css/media-views.css @@ -242,14 +242,6 @@ width: calc(48% - 12px); } -.media-modal-content .attachments-browser .media-toolbar-secondary { - width: 66%; -} - -.media-modal-content .media-toolbar-primary.search-form { - width: 33%; -} - .media-modal-content .media-toolbar-primary .media-button { float: right; } @@ -279,6 +271,20 @@ overflow: hidden; } +.media-frame-toolbar .media-toolbar { + top: initial; + bottom: -45px; + height: auto; + overflow: initial; + border-top: 1px solid #ddd; +} + +@media screen and (max-width: 782px) { + .media-frame-toolbar .media-toolbar { + bottom: -48px; + } +} + .media-toolbar-primary { float: right; height: 100%; @@ -686,7 +692,6 @@ overflow: auto; background: #fff; border-top: 1px solid #ddd; - border-bottom: 1px solid #ddd; } .media-frame-toolbar { @@ -696,6 +701,8 @@ bottom: 0; height: 60px; z-index: 100; + bottom: 60px; + height: auto; } .media-frame.hide-menu .media-frame-title,