Changeset 36295

Timestamp:

01/14/2016 04:12:16 AM (11 years ago)

Author:

johnbillion

Message:

Administration: Add a "Drag boxes here" message to empty dashboard meta boxes so it's clear to users that it's possible to drag meta boxes into empty spaces.

Props xavortm
Fixes #26399

Location:

trunk/src

Files:

• wp-admin/css/common.css (modified) (1 diff)
• wp-admin/css/dashboard.css (modified) (3 diffs)
• wp-admin/js/postbox.js (modified) (1 diff)
• wp-includes/script-loader.php (modified) (1 diff)

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

@@ -1844 +1844 @@
         border: 3px dashed #b4b9be;
         height: 250px;
+        position: relative;
+}
+
+.metabox-holder .postbox-container .empty-container:after {
+        content: attr(data-emptystring);
+        margin: auto;
+        position: absolute;
+        top: 0;
+        left: 0;
+        bottom: 0;
+        right: 0;
+        height: 1em;
+        width: 200px;
+        text-align: center;
+        color: #ccc;
+        font-size:18px;
+        display: none;
 }
 

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

@@ -992 +992 @@
         }
 
+        #dashboard-widgets #postbox-container-3 .empty-container:after, 
+        #dashboard-widgets #postbox-container-4 .empty-container:after { 
+                display: none; 
+        }
+
         #wpbody #wpbody-content #dashboard-widgets.columns-1 .postbox-container {
                 width: 100%;
@@ -1012 +1017 @@
                 display: none;
         }
+
+        .metabox-holder .postbox-container .empty-container:after {
+                display: block;
+        }
 }
 
@@ -1033 +1042 @@
                 height: 0;
                 min-height: 0;
+        }
+
+        #dashboard-widgets #postbox-container-4 .empty-container:after {
+                display: none;
+        }
+
+        .metabox-holder .postbox-container .empty-container:after {
+                display: block;
         }
 }

trunk/src/wp-admin/js/postbox.js

@@ -198 +198 @@
                                 var t = $(this);
 
-                                if ( visible == 1 || t.children('.postbox:visible').length )
+                                if ( visible == 1 || t.children('.postbox:visible').length ) {
                                         t.removeClass('empty-container');
-                                else
+                                }
+                                else {
                                         t.addClass('empty-container');
+                                        t.attr('data-emptyString', postBoxL10n.postBoxEmptyString);
+                                }
                         });
 

trunk/src/wp-includes/script-loader.php

@@ -496 +496 @@
 
                 $scripts->add( 'postbox', "/wp-admin/js/postbox$suffix.js", array('jquery-ui-sortable'), false, 1 );
+                did_action( 'init' ) && $scripts->localize( 'postbox', 'postBoxL10n', array(
+                        'postBoxEmptyString' => __( 'Drag boxes here' ),
+                ) );
 
                 $scripts->add( 'tags-box', "/wp-admin/js/tags-box$suffix.js", array( 'jquery', 'suggest' ), false, 1 );