From 14bb2d7784db0142190af022c71c7267af8df873 Mon Sep 17 00:00:00 2001
From: Joe Dolson <joedolson@git.wordpress.org>
Date: Sat, 11 Feb 2023 17:37:30 +0000
Subject: [PATCH] Toolbar: Prevent false positive on automated contrast
 testing.

The non-focused state of the `.screen-reader-shortcut` element in the admin bar fails contrast tests. This has no real-world consequences, but raises false positives in some automated testing tools. This fix is largely so people using automated testing will not raise false positives.

Props sabernhardt, afercia, robinwpdeveloper, re_enter_rupok.
Fixes #56789.

git-svn-id: https://develop.svn.wordpress.org/trunk@55307 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/common.css       | 11 +++++++----
 src/wp-includes/css/admin-bar.css |  9 +++++----
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/wp-admin/css/common.css b/src/wp-admin/css/common.css
index 73d92d661d..75048d3be5 100644
--- a/src/wp-admin/css/common.css
+++ b/src/wp-admin/css/common.css
@@ -141,21 +141,24 @@
 .screen-reader-shortcut {
 	position: absolute;
 	top: -1000em;
-}
-
-.screen-reader-shortcut:focus {
 	left: 6px;
-	top: -25px;
 	height: auto;
 	width: auto;
 	display: block;
 	font-size: 14px;
 	font-weight: 600;
 	padding: 15px 23px 14px;
+	/* Background and color set to prevent false positives in automated accessibility tests. */
 	background: #f0f0f1;
 	color: #2271b1;
 	z-index: 100000;
 	line-height: normal;
+}
+
+.screen-reader-shortcut:focus {
+	top: -25px;
+	/* Overrides a:focus in the admin. See ticket #56789. */
+	color: #2271b1;
 	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 	text-decoration: none;
 	/* Only visible in Windows High Contrast mode */
diff --git a/src/wp-includes/css/admin-bar.css b/src/wp-includes/css/admin-bar.css
index 062517fac7..8f73274b03 100644
--- a/src/wp-includes/css/admin-bar.css
+++ b/src/wp-includes/css/admin-bar.css
@@ -719,11 +719,7 @@ html:lang(he-il) .rtl #wpadminbar * {
 #wpadminbar .screen-reader-shortcut {
 	position: absolute;
 	top: -1000em;
-}
-
-#wpadminbar .screen-reader-shortcut:focus {
 	left: 6px;
-	top: 7px;
 	height: auto;
 	width: auto;
 	display: block;
@@ -735,6 +731,11 @@ html:lang(he-il) .rtl #wpadminbar * {
 	z-index: 100000;
 	line-height: normal;
 	text-decoration: none;
+}
+
+#wpadminbar .screen-reader-shortcut:focus {
+	top: 7px;
+	background: #f0f0f1;
 	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 }