diff --git a/src/wp-admin/css/media.css b/src/wp-admin/css/media.css index 2ba0ce4063..b0ee3a1e03 100644 --- a/src/wp-admin/css/media.css +++ b/src/wp-admin/css/media.css @@ -456,14 +456,12 @@ border color while dragging a file over the uploader drop area */ } .upload-php .mode-grid .media-sidebar { - z-index: 1900; - top: 102px; - bottom: auto; - background: #fff; - border-left: none; - padding: 16px; - -webkit-box-shadow: -1px 0 1px rgba(0,0,0,.3); - box-shadow: -1px 0 1px rgba(0,0,0,.3); + position: relative; + width: auto; + margin-bottom: 16px; + padding: 0 16px; + border: 1px solid #c00; + background-color: #feebe8; } .upload-php .mode-grid .hide-sidebar .media-sidebar { @@ -473,12 +471,20 @@ border color while dragging a file over the uploader drop area */ .upload-php .mode-grid .media-sidebar .media-uploader-status { border-bottom: none; padding-bottom: 0; + max-width: 100%; +} + +.upload-php .mode-grid .media-sidebar .upload-error { + margin: 20px 0; + padding: 0; + border: none; + background: none; } .upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors { font-size: 0; - top: -20px; - right: -14px; + top: -12px; + right: -10px; } .upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:before { @@ -1195,3 +1201,9 @@ audio, video { width: 100%; } } + +@media only screen and (max-width: 640px), screen and (max-height: 400px) { + .upload-php .mode-grid .media-sidebar{ + max-width: 100%; + } +} diff --git a/src/wp-includes/js/media-views.js b/src/wp-includes/js/media-views.js index 233db54420..acb42d0158 100644 --- a/src/wp-includes/js/media-views.js +++ b/src/wp-includes/js/media-views.js @@ -5749,12 +5749,12 @@ this.listenTo( this.controller, 'toggle:upload:attachment', _.bind( this.toggleUploader, this ) ); this.createToolbar(); - this.createUploader(); - this.createAttachments(); - this.updateContent(); if ( this.options.sidebar ) { this.createSidebar(); } + this.createUploader(); + this.createAttachments(); + this.updateContent(); if ( ! this.options.sidebar || 'errors' === this.options.sidebar ) { this.$el.addClass( 'hide-sidebar' );