Quick/Bulk Edit: Improve the inline error messages styling.

- uses the core `notice` styles for the Quick Edit form inline error messages - adds missing periods at the end of a few error messages Props ocean90, karmatosed, melchoyce, afercia. Fixes #35496. Built from https://develop.svn.wordpress.org/trunk@41684 git-svn-id: http://core.svn.wordpress.org/trunk@41518 1a063a9b-81f0-0310-95a4-ce76da25c4cd
WordPress · Oct 2, 2017 · a42b9ce · a42b9ce
1 parent 6a67953
commit a42b9ce
Show file tree

Hide file tree

Showing 19 changed files with 87 additions and 73 deletions.
diff --git a/wp-admin/css/ie-rtl.css b/wp-admin/css/ie-rtl.css
@@ -285,7 +285,7 @@ table.fixed td {
 	width: 29%;
 }
 
-.inline-edit-row p.submit {
+.inline-edit-row .submit {
 	zoom: 100%;
 }
 

diff --git a/wp-admin/css/ie-rtl.min.css b/wp-admin/css/ie-rtl.min.css
diff --git a/wp-admin/css/ie.css b/wp-admin/css/ie.css
@@ -285,7 +285,7 @@ table.fixed td {
 	width: 29%;
 }
 
-.inline-edit-row p.submit {
+.inline-edit-row .submit {
 	zoom: 100%;
 }
 

diff --git a/wp-admin/css/ie.min.css b/wp-admin/css/ie.min.css
diff --git a/wp-admin/css/list-tables-rtl.css b/wp-admin/css/list-tables-rtl.css
@@ -150,19 +150,12 @@
 	margin: 0;
 	padding: 5px 7px 10px;
 	overflow: hidden;
-	text-align: center;
 }
 
 #replysubmit .button {
 	margin-left: 5px;
 }
 
-#replysubmit .error {
-	color: red;
-	line-height: 21px;
-	text-align: center;
-}
-
 #replyrow.inline-edit-row fieldset.comment-reply {
 	font-size: inherit;
 	line-height: inherit;
@@ -957,16 +950,19 @@ tr.inline-edit-row td,
 	line-height: 2.5;
 }
 
-.inline-edit-row p.submit {
+.inline-edit-row .submit {
 	clear: both;
 	padding: 0.5em;
 	margin: 0.5em 0 0;
 }
 
-.inline-edit-row span.error {
-	line-height: 22px;
-	margin: 0 15px;
-	padding: 3px 5px;
+.inline-edit-row .notice-error {
+	margin-top: 1em;
+}
+
+.inline-edit-row .notice-error .error {
+	margin: 0.5em 0;
+	padding: 2px;
 }
 
 /*	Positioning */

diff --git a/wp-admin/css/list-tables-rtl.min.css b/wp-admin/css/list-tables-rtl.min.css
diff --git a/wp-admin/css/list-tables.css b/wp-admin/css/list-tables.css
@@ -150,19 +150,12 @@
 	margin: 0;
 	padding: 5px 7px 10px;
 	overflow: hidden;
-	text-align: center;
 }
 
 #replysubmit .button {
 	margin-right: 5px;
 }
 
-#replysubmit .error {
-	color: red;
-	line-height: 21px;
-	text-align: center;
-}
-
 #replyrow.inline-edit-row fieldset.comment-reply {
 	font-size: inherit;
 	line-height: inherit;
@@ -957,16 +950,19 @@ tr.inline-edit-row td,
 	line-height: 2.5;
 }
 
-.inline-edit-row p.submit {
+.inline-edit-row .submit {
 	clear: both;
 	padding: 0.5em;
 	margin: 0.5em 0 0;
 }
 
-.inline-edit-row span.error {
-	line-height: 22px;
-	margin: 0 15px;
-	padding: 3px 5px;
+.inline-edit-row .notice-error {
+	margin-top: 1em;
+}
+
+.inline-edit-row .notice-error .error {
+	margin: 0.5em 0;
+	padding: 2px;
 }
 
 /*	Positioning */

diff --git a/wp-admin/css/list-tables.min.css b/wp-admin/css/list-tables.min.css
diff --git a/wp-admin/includes/class-wp-posts-list-table.php b/wp-admin/includes/class-wp-posts-list-table.php
@@ -1737,7 +1737,7 @@ public function inline_edit() {
 
 		}
 	?>
-		<p class="submit inline-edit-save">
+		<div class="submit inline-edit-save">
 			<button type="button" class="button cancel alignleft"><?php _e( 'Cancel' ); ?></button>
 			<?php if ( ! $bulk ) {
 				wp_nonce_field( 'inlineeditnonce', '_inline_edit', false );
@@ -1752,9 +1752,11 @@ public function inline_edit() {
 			<?php if ( ! $bulk && ! post_type_supports( $screen->post_type, 'author' ) ) { ?>
 				<input type="hidden" name="post_author" value="<?php echo esc_attr( $post->post_author ); ?>" />
 			<?php } ?>
-			<span class="error" style="display:none"></span>
 			<br class="clear" />
-		</p>
+			<div class="notice notice-error notice-alt inline hidden">
+				<p class="error"></p>
+			</div>
+		</div>
 		</td></tr>
 	<?php
 		$bulk++;

diff --git a/wp-admin/includes/class-wp-terms-list-table.php b/wp-admin/includes/class-wp-terms-list-table.php
@@ -616,16 +616,18 @@ public function inline_edit() {
 
 	?>
 
-		<p class="inline-edit-save submit">
+		<div class="inline-edit-save submit">
 			<button type="button" class="cancel button alignleft"><?php _e( 'Cancel' ); ?></button>
 			<button type="button" class="save button button-primary alignright"><?php echo $tax->labels->update_item; ?></button>
 			<span class="spinner"></span>
-			<span class="error" style="display:none;"></span>
 			<?php wp_nonce_field( 'taxinlineeditnonce', '_inline_edit', false ); ?>
 			<input type="hidden" name="taxonomy" value="<?php echo esc_attr( $this->screen->taxonomy ); ?>" />
 			<input type="hidden" name="post_type" value="<?php echo esc_attr( $this->screen->post_type ); ?>" />
 			<br class="clear" />
-		</p>
+			<div class="notice notice-error notice-alt inline hidden">
+				<p class="error"></p>
+			</div>
+		</div>
 		</td></tr>
 		</tbody></table></form>
 	<?php

diff --git a/wp-admin/includes/template.php b/wp-admin/includes/template.php
@@ -423,15 +423,21 @@ function wp_comment_reply( $position = 1, $checkbox = false, $mode = 'single', $
 		</div>
 	</div>
 
-	<p id="replysubmit" class="submit">
-	<a href="#comments-form" class="save button button-primary alignright">
-	<span id="addbtn" style="display:none;"><?php _e('Add Comment'); ?></span>
-	<span id="savebtn" style="display:none;"><?php _e('Update Comment'); ?></span>
-	<span id="replybtn" style="display:none;"><?php _e('Submit Reply'); ?></span></a>
-	<a href="#comments-form" class="cancel button alignleft"><?php _e('Cancel'); ?></a>
-	<span class="waiting spinner"></span>
-	<span class="error" style="display:none;"></span>
-	</p>
+	<div id="replysubmit" class="submit">
+		<p>
+			<a href="#comments-form" class="save button button-primary alignright">
+				<span id="addbtn" style="display: none;"><?php _e( 'Add Comment' ); ?></span>
+				<span id="savebtn" style="display: none;"><?php _e( 'Update Comment' ); ?></span>
+				<span id="replybtn" style="display: none;"><?php _e( 'Submit Reply' ); ?></span>
+			</a>
+			<a href="#comments-form" class="cancel button alignleft"><?php _e( 'Cancel' ); ?></a>
+			<span class="waiting spinner"></span>
+		</p>
+		<br class="clear" />
+		<div class="notice notice-error notice-alt inline hidden">
+			<p class="error"></p>
+		</div>
+	</div>
 
 	<input type="hidden" name="action" id="action" value="" />
 	<input type="hidden" name="comment_ID" id="comment_ID" value="" />
@@ -892,7 +898,7 @@ function wp_import_upload_form( $action ) {
  * @param string|array|WP_Screen $screen        Optional. The screen or screens on which to show the box
  *                                              (such as a post type, 'link', or 'comment'). Accepts a single
  *                                              screen ID, WP_Screen object, or array of screen IDs. Default
- *                                              is the current screen.  If you have used add_menu_page() or 
+ *                                              is the current screen.  If you have used add_menu_page() or
  *                                              add_submenu_page() to create a new screen (and hence screen_id),
  *                                              make sure your menu slug conforms to the limits of sanitize_key()
  *                                              otherwise the 'screen' menu may not correctly render on your page.

diff --git a/wp-admin/js/edit-comments.js b/wp-admin/js/edit-comments.js
@@ -653,7 +653,9 @@ commentReply = {
 		$('#com-reply').append( replyrow );
 		$('#replycontent').css('height', '').val('');
 		$('#edithead input').val('');
-		$('.error', replyrow).empty().hide();
+		$( '.notice-error', replyrow )
+			.addClass( 'hidden' )
+			.find( '.error' ).empty();
 		$( '.spinner', replyrow ).removeClass( 'is-active' );
 
 		this.cid = '';
@@ -754,9 +756,10 @@ commentReply = {
 	},
 
 	send : function() {
-		var post = {};
+		var post = {},
+			$errorNotice = $( '#replysubmit .error-notice' );
 
-		$('#replysubmit .error').hide();
+		$errorNotice.addClass( 'hidden' );
 		$( '#replysubmit .spinner' ).addClass( 'is-active' );
 
 		$('#replyrow input').not(':button').each(function() {
@@ -847,16 +850,19 @@ commentReply = {
 	},
 
 	error : function(r) {
-		var er = r.statusText;
+		var er = r.statusText,
+			$errorNotice = $( '#replysubmit .notice-error' ),
+			$error = $errorNotice.find( '.error' );
 
 		$( '#replysubmit .spinner' ).removeClass( 'is-active' );
 
 		if ( r.responseText )
 			er = r.responseText.replace( /<.[^<>]*?>/g, '' );
 
-		if ( er )
-			$('#replysubmit .error').html(er).show();
-
+		if ( er ) {
+			$errorNotice.removeClass( 'hidden' );
+			$error.html( er );
+		}
 	},
 
 	addcomment: function(post_id) {