From 2e6fb68b2a27a65434cca35d8dec9ec1860a1156 Mon Sep 17 00:00:00 2001
From: John Blackbourn <johnbillion@git.wordpress.org>
Date: Thu, 14 Jan 2016 04:12:16 +0000
Subject: [PATCH] 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


git-svn-id: https://develop.svn.wordpress.org/trunk@36295 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/common.css       | 17 +++++++++++++++++
 src/wp-admin/css/dashboard.css    | 17 +++++++++++++++++
 src/wp-admin/js/postbox.js        |  7 +++++--
 src/wp-includes/script-loader.php |  3 +++
 4 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css
index 561e610da9..e340632b52 100644
--- a/src/wp-admin/css/common.css
+++ b/src/wp-admin/css/common.css
@@ -1843,6 +1843,23 @@ html.wp-toolbar {
 .metabox-holder .postbox-container .empty-container {
 	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;
 }
 
 .metabox-holder.columns-1 .postbox-container .empty-container,
diff --git a/src/wp-admin/css/dashboard.css b/src/wp-admin/css/dashboard.css
index def7c4516f..bca7f66653 100644
--- a/src/wp-admin/css/dashboard.css
+++ b/src/wp-admin/css/dashboard.css
@@ -991,6 +991,11 @@ a.rsswidget {
 		min-height: 0;
 	}
 
+	#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%;
 	}
@@ -1011,6 +1016,10 @@ a.rsswidget {
 	.columns-prefs .columns-prefs-4 {
 		display: none;
 	}
+
+	.metabox-holder .postbox-container .empty-container:after {
+		display: block;
+	}
 }
 
 /* three columns on the dash */
@@ -1033,6 +1042,14 @@ a.rsswidget {
 		height: 0;
 		min-height: 0;
 	}
+
+	#dashboard-widgets #postbox-container-4 .empty-container:after {
+		display: none;
+	}
+
+	.metabox-holder .postbox-container .empty-container:after {
+		display: block;
+	}
 }
 
 @media screen and (max-width: 870px) {
diff --git a/src/wp-admin/js/postbox.js b/src/wp-admin/js/postbox.js
index 9d7a938d8a..37b26b8642 100644
--- a/src/wp-admin/js/postbox.js
+++ b/src/wp-admin/js/postbox.js
@@ -197,10 +197,13 @@ var postboxes;
 			$( '#dashboard-widgets .meta-box-sortables:visible' ).each( function() {
 				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);
+				}
 			});
 
 			if ( side.length ) {
diff --git a/src/wp-includes/script-loader.php b/src/wp-includes/script-loader.php
index 0308807914..5401bc488d 100644
--- a/src/wp-includes/script-loader.php
+++ b/src/wp-includes/script-loader.php
@@ -495,6 +495,9 @@ function wp_default_scripts( &$scripts ) {
 		$scripts->add( 'xfn', "/wp-admin/js/xfn$suffix.js", array('jquery'), false, 1 );
 
 		$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 );
 		did_action( 'init' ) && $scripts->localize( 'tags-box', 'tagsBoxL10n', array(