From c69509b2abefc7458386e39fbc3b60e9e5130512 Mon Sep 17 00:00:00 2001
From: Andrea Fercia <afercia@git.wordpress.org>
Date: Sat, 19 Dec 2015 00:16:30 +0000
Subject: [PATCH] Accessibility: Remove title attributes and improve
 accessibility on the "no-js" Menus screen.

When JavaScript is off, the reorder menu item and Edit menu item links now use `aria-label`
attributes instead of title attributes.

Fixes #35134.

git-svn-id: https://develop.svn.wordpress.org/trunk@36016 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/nav-menus.css                | 24 ++++++++++++++++---
 .../includes/class-walker-nav-menu-edit.php   |  8 +++----
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/wp-admin/css/nav-menus.css b/src/wp-admin/css/nav-menus.css
index 9084875604..4035c7f7e3 100644
--- a/src/wp-admin/css/nav-menus.css
+++ b/src/wp-admin/css/nav-menus.css
@@ -618,6 +618,20 @@ body.menu-max-depth-11 { min-width: 1280px !important; }
 	white-space: nowrap;
 }
 
+.no-js.nav-menus-php .item-edit {
+	position: static;
+	float: right;
+	width: auto;
+	height: auto;
+	margin-right: -10px !important;
+	padding: 12px 0;
+	color: #0073aa;
+	text-decoration: underline;
+	font-size: 12px;
+	line-height: 18px;
+	text-indent: 0;
+}
+
 .nav-menus-php .item-edit:before {
 	margin-top: 10px;
 	margin-left: 4px;
@@ -627,6 +641,10 @@ body.menu-max-depth-11 { min-width: 1280px !important; }
 	text-indent: -1px; /* account for the dashicon alignment */
 }
 
+.no-js.nav-menus-php .item-edit:before {
+	display: none;
+}
+
 .rtl .nav-menus-php .item-edit:before {
 	text-indent: 1px; /* account for the dashicon alignment */
 }
@@ -638,10 +656,10 @@ body.menu-max-depth-11 { min-width: 1280px !important; }
 
 .nav-menus-php .item-edit:focus:before {
 	-webkit-box-shadow:
-    	0 0 0 1px #5b9dd9,
+		0 0 0 1px #5b9dd9,
 		0 0 2px 1px rgba(30, 140, 190, .8);
-    box-shadow:
-    	0 0 0 1px #5b9dd9,
+	box-shadow:
+		0 0 0 1px #5b9dd9,
 		0 0 2px 1px rgba(30, 140, 190, .8);
 }
 
diff --git a/src/wp-admin/includes/class-walker-nav-menu-edit.php b/src/wp-admin/includes/class-walker-nav-menu-edit.php
index 105e613a4f..33131c7f1f 100644
--- a/src/wp-admin/includes/class-walker-nav-menu-edit.php
+++ b/src/wp-admin/includes/class-walker-nav-menu-edit.php
@@ -126,7 +126,7 @@ class Walker_Nav_Menu_Edit extends Walker_Nav_Menu {
 									),
 									'move-menu_item'
 								);
-							?>" class="item-move-up"><abbr title="<?php esc_attr_e('Move up'); ?>">&#8593;</abbr></a>
+							?>" class="item-move-up" aria-label="<?php esc_attr_e( 'Move up' ) ?>">&#8593;</a>
 							|
 							<a href="<?php
 								echo wp_nonce_url(
@@ -139,11 +139,11 @@ class Walker_Nav_Menu_Edit extends Walker_Nav_Menu {
 									),
 									'move-menu_item'
 								);
-							?>" class="item-move-down"><abbr title="<?php esc_attr_e('Move down'); ?>">&#8595;</abbr></a>
+							?>" class="item-move-down" aria-label="<?php esc_attr_e( 'Move down' ) ?>">&#8595;</a>
 						</span>
-						<a class="item-edit" id="edit-<?php echo $item_id; ?>" title="<?php esc_attr_e('Edit Menu Item'); ?>" href="<?php
+						<a class="item-edit" id="edit-<?php echo $item_id; ?>" href="<?php
 							echo ( isset( $_GET['edit-menu-item'] ) && $item_id == $_GET['edit-menu-item'] ) ? admin_url( 'nav-menus.php' ) : add_query_arg( 'edit-menu-item', $item_id, remove_query_arg( $removed_args, admin_url( 'nav-menus.php#menu-item-settings-' . $item_id ) ) );
-						?>"><?php _e( 'Edit Menu Item' ); ?></a>
+						?>" aria-label="<?php esc_attr_e( 'Edit menu item' ); ?>"><?php _e( 'Edit' ); ?></a>
 					</span>
 				</div>
 			</div>