From 398a2996aedffa8181c125ccb9bd396f7f6fa1e5 Mon Sep 17 00:00:00 2001
From: Andrea Fercia <afercia@git.wordpress.org>
Date: Thu, 17 Dec 2015 23:43:57 +0000
Subject: [PATCH] Accessibility: Remove the title attribute from the Featured
 Image postbox thumbnail.

The title attribute is now replaced with plain text in a `howto` paragraph, as done for example in the Tags postbox.
Adds an `aria-describedby` attribute on the thumbnail link to target the description.
Also, fixes the focus style on the featured image thumbnail.

Fixes #35076.

git-svn-id: https://develop.svn.wordpress.org/trunk@36000 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-admin/css/edit.css      | 6 ++++++
 src/wp-admin/includes/post.php | 5 ++---
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/wp-admin/css/edit.css b/src/wp-admin/css/edit.css
index 2dca35b986..230a8b151f 100644
--- a/src/wp-admin/css/edit.css
+++ b/src/wp-admin/css/edit.css
@@ -303,10 +303,16 @@ ul.wp-tab-bar li {
 	padding: 3px 5px 5px;
 }
 
+#set-post-thumbnail {
+	display: inline-block;
+	max-width: 100%;
+}
+
 #postimagediv .inside img {
 	max-width: 100%;
 	height: auto;
 	width: auto;
+	vertical-align: top;
 	background-image: -webkit-linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), -webkit-linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
 	background-image: linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
 	background-position: 0 0, 10px 10px;
diff --git a/src/wp-admin/includes/post.php b/src/wp-admin/includes/post.php
index 3df8af8f3a..51ce4c0cf7 100644
--- a/src/wp-admin/includes/post.php
+++ b/src/wp-admin/includes/post.php
@@ -1380,11 +1380,10 @@ function _wp_post_thumbnail_html( $thumbnail_id = null, $post = null ) {
 
 	$post               = get_post( $post );
 	$post_type_object   = get_post_type_object( $post->post_type );
-	$set_thumbnail_link = '<p class="hide-if-no-js"><a title="%s" href="%s" id="set-post-thumbnail" class="thickbox">%s</a></p>';
+	$set_thumbnail_link = '<p class="hide-if-no-js"><a href="%s" id="set-post-thumbnail" aria-describedby="set-post-thumbnail-desc" class="thickbox">%s</a></p>';
 	$upload_iframe_src  = get_upload_iframe_src( 'image', $post->ID );
 
 	$content = sprintf( $set_thumbnail_link,
-		esc_attr( $post_type_object->labels->set_featured_image ),
 		esc_url( $upload_iframe_src ),
 		esc_html( $post_type_object->labels->set_featured_image )
 	);
@@ -1416,10 +1415,10 @@ function _wp_post_thumbnail_html( $thumbnail_id = null, $post = null ) {
 		if ( !empty( $thumbnail_html ) ) {
 			$ajax_nonce = wp_create_nonce( 'set_post_thumbnail-' . $post->ID );
 			$content = sprintf( $set_thumbnail_link,
-				esc_attr( $post_type_object->labels->set_featured_image ),
 				esc_url( $upload_iframe_src ),
 				$thumbnail_html
 			);
+			$content .= '<p class="hide-if-no-js howto" id="set-post-thumbnail-desc">' . __( 'Click the image to edit or update' ) . '</p>';
 			$content .= '<p class="hide-if-no-js"><a href="#" id="remove-post-thumbnail" onclick="WPRemoveThumbnail(\'' . $ajax_nonce . '\');return false;">' . esc_html( $post_type_object->labels->remove_featured_image ) . '</a></p>';
 		}
 	}