From 76f9c714dbf84368aefe658d3a18fc839ae65150 Mon Sep 17 00:00:00 2001
From: Bradley Taylor <hello@brad-taylor.co.uk>
Date: Tue, 12 Oct 2021 16:04:23 +0100
Subject: [PATCH] Add alt text to spacer elements

All HTML img elements should contain an alt attribute.
For decorative or spacer elements this alt text should be a blank string,
which indicates to assistive technologies that the image should not be announced.

Longer-term these spacer gifs could be replaced with empty <span> elements.
Inline-block css has been added to allow for this change in future,
however, the HTML element has not been changed for now to avoid breakage with non-default themes
(e.g. civicrm-admin-utilities WordPress plugin which replaces the default css/civicrm.css file)
---
 CRM/Utils/Weight.php | 8 ++++----
 css/civicrm.css      | 1 +
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/CRM/Utils/Weight.php b/CRM/Utils/Weight.php
index d4961f7769..891db2fa7a 100644
--- a/CRM/Utils/Weight.php
+++ b/CRM/Utils/Weight.php
@@ -400,8 +400,8 @@ class CRM_Utils_Weight {
         $links[] = "<a class=\"crm-weight-arrow\" href=\"{$url}&amp;dst={$prevID}&amp;dir=swap\"><img src=\"{$imageURL}/up.gif\" title=\"$alt\" alt=\"$alt\" class=\"order-icon\"></a>";
       }
       else {
-        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\">";
-        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\">";
+        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\" alt=''>";
+        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\" alt=''>";
       }
 
       if ($nextID != 0) {
@@ -412,8 +412,8 @@ class CRM_Utils_Weight {
         $links[] = "<a class=\"crm-weight-arrow\" href=\"{$url}&amp;dst={$lastID}&amp;dir=last\"><img src=\"{$imageURL}/last.gif\" title=\"$alt\" alt=\"$alt\" class=\"order-icon\"></a>";
       }
       else {
-        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\">";
-        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\">";
+        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\" alt=''>";
+        $links[] = "<img src=\"{$imageURL}/spacer.gif\" class=\"order-icon\" alt=''>";
       }
       $rows[$id]['weight'] = implode('&nbsp;', $links);
     }
diff --git a/css/civicrm.css b/css/civicrm.css
index a19ac30c45..dd2319bb2f 100644
--- a/css/civicrm.css
+++ b/css/civicrm.css
@@ -1853,6 +1853,7 @@ input.crm-form-entityref {
   width: 10px;
   padding-top: 4px;
   padding-right: 4px;
+  display: inline-block;
 }
 
 /* crm button style */
-- 
2.25.1