Changeset 32862

Timestamp:

06/19/2015 06:55:52 PM (10 years ago)

Author:

wonderboymusic

Message:

Media Library Bulk Select button size should be smaller.

Props afercia.
Fixes #32325.

Location:

trunk/src

Files:

• wp-admin/css/media.css (modified) (3 diffs)
• wp-includes/css/media-views.css (modified) (1 diff)
• wp-includes/js/media-grid.js (modified) (2 diffs)
• wp-includes/js/media/views/button/select-mode-toggle.js (modified) (2 diffs)

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

@@ -462 +462 @@
     border-left: 4px solid #dd3d36;
     -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
-    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); 
-    background-color: #fff; 
+    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
+    background-color: #fff;
 }
 
@@ -571 +571 @@
 }
 
-.media-frame.mode-grid .media-toolbar-secondary > .media-button {
-    margin-top: 10px;
-    margin-bottom: 10px;
+.media-frame.mode-grid.mode-edit .media-toolbar-secondary > .select-mode-toggle-button {
+    margin: 0 8px 0 0;
+    vertical-align: middle;
 }
 
@@ -586 +586 @@
 
 .media-frame.mode-grid .spinner {
-    margin-top: 15px;
+    margin-top: 16px;
 }
 

trunk/src/wp-includes/css/media-views.css

@@ -1834 +1834 @@
 .mejs-container:focus {
     outline: 1px solid #5b9dd9;
+    -webkit-box-shadow: 0 0 2px 1px rgba(30, 140, 190, .8);
     box-shadow: 0 0 2px 1px rgba(30, 140, 190, .8);
 }

trunk/src/wp-includes/js/media-grid.js

@@ -280 +280 @@
 SelectModeToggle = Button.extend({
     initialize: function() {
+        _.defaults( this.options, {
+            size : ''
+        } );
+
         Button.prototype.initialize.apply( this, arguments );
         this.listenTo( this.controller, 'select:activate select:deactivate', this.toggleBulkEditHandler );
@@ -311 +315 @@
         // TODO: the Frame should be doing all of this.
         if ( this.controller.isModeActive( 'select' ) ) {
-            this.model.set( 'text', l10n.cancelSelection );
+            this.model.set( {
+                size: 'large',
+                text: l10n.cancelSelection
+            } );
             children.not( '.spinner, .media-button' ).hide();
             this.$el.show();
             toolbar.$( '.delete-selected-button' ).removeClass( 'hidden' );
         } else {
-            this.model.set( 'text', l10n.bulkSelect );
+            this.model.set( {
+                size: '',
+                text: l10n.bulkSelect
+            } );
             this.controller.content.get().$el.removeClass( 'fixed' );
             toolbar.$el.css( 'width', '' );

trunk/src/wp-includes/js/media/views/button/select-mode-toggle.js

@@ -16 +16 @@
 SelectModeToggle = Button.extend({
     initialize: function() {
+        _.defaults( this.options, {
+            size : ''
+        } );
+
         Button.prototype.initialize.apply( this, arguments );
         this.listenTo( this.controller, 'select:activate select:deactivate', this.toggleBulkEditHandler );
@@ -47 +51 @@
         // TODO: the Frame should be doing all of this.
         if ( this.controller.isModeActive( 'select' ) ) {
-            this.model.set( 'text', l10n.cancelSelection );
+            this.model.set( {
+                size: 'large',
+                text: l10n.cancelSelection
+            } );
             children.not( '.spinner, .media-button' ).hide();
             this.$el.show();
             toolbar.$( '.delete-selected-button' ).removeClass( 'hidden' );
         } else {
-            this.model.set( 'text', l10n.bulkSelect );
+            this.model.set( {
+                size: '',
+                text: l10n.bulkSelect
+            } );
             this.controller.content.get().$el.removeClass( 'fixed' );
             toolbar.$el.css( 'width', '' );