From d013696652b293ff9318f6cb0c83c01c44895589 Mon Sep 17 00:00:00 2001
From: Andrea Fercia <afercia@git.wordpress.org>
Date: Sat, 25 May 2019 17:14:29 +0000
Subject: [PATCH] Accessibility: Improve toggling the "Post locked" information
 visibility.

- effectively hides the "Post locked" information from assistive technologies
- when a post is locked, reveals the "Post locked" information without CSS animation
- the height CSS animation didn't work anyways after [24906]

See #24553.
Fixes #44946.


git-svn-id: https://develop.svn.wordpress.org/trunk@45417 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/js/_enqueues/admin/inline-edit-post.js |  3 +-
 src/wp-admin/css/list-tables.css           | 32 ++++++++++------------
 2 files changed, 15 insertions(+), 20 deletions(-)

diff --git a/src/js/_enqueues/admin/inline-edit-post.js b/src/js/_enqueues/admin/inline-edit-post.js
index cdca55dd89..b39b9b6466 100644
--- a/src/js/_enqueues/admin/inline-edit-post.js
+++ b/src/js/_enqueues/admin/inline-edit-post.js
@@ -529,8 +529,7 @@ $( document ).on( 'heartbeat-tick.wp-check-locked-posts', function( e, data ) {
 				row.addClass('wp-locked');
 			}
 		} else if ( row.hasClass('wp-locked') ) {
-			// Make room for the CSS animation
-			row.removeClass('wp-locked').delay(1000).find('.locked-info span').empty();
+			row.removeClass( 'wp-locked' ).find( '.locked-info span' ).empty();
 		}
 	});
 }).on( 'heartbeat-send.wp-check-locked-posts', function( e, data ) {
diff --git a/src/wp-admin/css/list-tables.css b/src/wp-admin/css/list-tables.css
index 91b1a2c9ce..6cfa72e087 100644
--- a/src/wp-admin/css/list-tables.css
+++ b/src/wp-admin/css/list-tables.css
@@ -537,13 +537,14 @@ th.asc a:focus span.sorting-indicator:before {
 	content: "\f142";
 }
 
-tr.wp-locked .locked-indicator {
+.locked-indicator {
+	display: none;
 	margin-left: 6px;
 	height: 20px;
 	width: 16px;
 }
 
-tr.wp-locked .locked-indicator-icon:before {
+.locked-indicator-icon:before {
 	color: #82878c;
 	content: "\f160";
 	display: inline-block;
@@ -554,30 +555,25 @@ tr.wp-locked .locked-indicator-icon:before {
 	-moz-osx-font-smoothing: grayscale;
 }
 
-tr.wp-locked .check-column label,
-tr.wp-locked .check-column input[type="checkbox"],
-tr.wp-locked .row-actions .inline,
-tr.wp-locked .row-actions .trash {
+.locked-info {
 	display: none;
-}
-
-tr .locked-info {
-	height: 0;
-	opacity: 0;
-}
-
-tr.wp-locked .locked-info {
 	margin-top: 4px;
-	height: auto;
-	opacity: 1;
 }
 
 .locked-text {
 	vertical-align: top;
 }
 
-tr.locked-info, tr.wp-locked .locked-info {
-	transition: height 1s, opacity 0.5s;
+.wp-locked .locked-indicator,
+.wp-locked .locked-info {
+	display: block;
+}
+
+tr.wp-locked .check-column label,
+tr.wp-locked .check-column input[type="checkbox"],
+tr.wp-locked .row-actions .inline,
+tr.wp-locked .row-actions .trash {
+	display: none;
 }
 
 .fixed .column-comments .sorting-indicator {