Add aria-label to back button

W3C accessibility testing -- need to add description for screen readers.
eb1 · Jan 30, 2024 · dd46a28 · dd46a28
1 parent 5537aa1
commit dd46a28
Show file tree

Hide file tree

Showing 8 changed files with 8 additions and 14 deletions.
diff --git a/www/tpl/Chapter.html b/www/tpl/Chapter.html
@@ -3,7 +3,7 @@
     container -- the toolbar and menus, etc -- but the individual strips are rendered by the template SourcePhrase.html.
 }}
 <div id="title" class="topcoat-navigation-bar main_title bg-lightblue">
-    <div class="topcoat-navigation-bar__item left"><a id="back" class="topcoat-icon-button--quiet back-button" href="index.html"><span class="topcoat-icon topcoat-icon--back"></span></a></div>
+    <div class="topcoat-navigation-bar__item left"><a id="back" aria-label="{{ t 'view.dscBack'}}" class="topcoat-icon-button--quiet back-button" href="index.html"><span class="topcoat-icon topcoat-icon--back"></span></a></div>
     <div class="topcoat-navigation-bar__item left">
         <button id="Undo" title="{{ t 'view.dscUndo'}}" class="topcoat-icon-button--quiet toolbar-button" disabled><span  class="topcoat-icon topcoat-icon--undo"></span><span class="side-nav__list__item__label">{{ t 'view.lblUndo'}}</span></button>
     </div>

diff --git a/www/tpl/Export.html b/www/tpl/Export.html
@@ -4,7 +4,7 @@
 
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
-        <a class="topcoat-icon-button--quiet back-button" href="index.html">
+        <a class="topcoat-icon-button--quiet back-button" aria-label="{{ t 'view.dscBack'}}" href="index.html">
             <span class="topcoat-icon topcoat-icon--back"></span>
         </a>
     </div>

diff --git a/www/tpl/Lookup.html b/www/tpl/Lookup.html
@@ -4,7 +4,7 @@
 
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
-        <a class="topcoat-icon-button--quiet back-button" href="index.html">
+        <a class="topcoat-icon-button--quiet back-button" aria-label="{{ t 'view.dscBack'}}" href="index.html">
             <span class="topcoat-icon topcoat-icon--back"></span>
         </a>
     </div>

diff --git a/www/tpl/NewProject.html b/www/tpl/NewProject.html
@@ -5,12 +5,6 @@
 <div class="topcoat-navigation-bar main_title bg-lightblue" >
     <div class="topcoat-navigation-bar__item" style="height: 55px; width: 64px;">
         <div class="pie" id="progress" data-pie='{ "colorSlice": "#ffffff", "strokeWidth": 5, "size": 50, "time": 2, "fontColor": "#ffffff", "percent": 17 }'></div>
-
-<!--
-        <a class="topcoat-icon-button--quiet back-button" href="#">
-            <span class="topcoat-icon topcoat-icon--back"></span>
-        </a>
--->
     </div>
     <div class="topcoat-navigation-bar__item">
         <div class="topcoat-navigation-bar__title bg-lightblue" id="StepTitle"></div>

diff --git a/www/tpl/NewTU.html b/www/tpl/NewTU.html
@@ -4,7 +4,7 @@
 
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
-        <a class="topcoat-icon-button--quiet back-button" id="btnBack">
+        <a class="topcoat-icon-button--quiet back-button" aria-label="{{ t 'view.dscBack'}}" id="btnBack">
             <span class="topcoat-icon topcoat-icon--back"></span>
         </a>
     </div>

diff --git a/www/tpl/TargetUnit.html b/www/tpl/TargetUnit.html
@@ -7,7 +7,7 @@
 }}
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
-        <a class="topcoat-icon-button--quiet back-button" href="index.html"><span class="topcoat-icon topcoat-icon--back"></span></a>
+        <a class="topcoat-icon-button--quiet back-button" aria-label="{{ t 'view.dscBack'}}" href="index.html"><span class="topcoat-icon topcoat-icon--back"></span></a>
     </div>
     <div class="topcoat-navigation-bar__item half"><h2>{{t 'view.lblShowTranslations'}}</h2></div>
 </div>

diff --git a/www/tpl/TargetUnitList.html b/www/tpl/TargetUnitList.html
@@ -3,7 +3,7 @@
 }}
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
-        <a class="topcoat-icon-button--quiet back-button" href="index.html"><span class="topcoat-icon topcoat-icon--back"></span></a>
+        <a class="topcoat-icon-button--quiet back-button" aria-label="{{ t 'view.dscBack'}}" href="index.html"><span class="topcoat-icon topcoat-icon--back"></span></a>
     </div>
     <div class="topcoat-navigation-bar__item half"><h2>{{t 'view.lblKB'}}</h2></div>
     <div class="topcoat-navigation-bar__item right">

diff --git a/www/tpl/UILanguage.html b/www/tpl/UILanguage.html
@@ -4,7 +4,7 @@
 
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
-        <a class="topcoat-icon-button--quiet back-button" href="index.html">
+        <a class="topcoat-icon-button--quiet back-button" aria-label="{{ t 'view.dscBack'}}" href="index.html">
             <span class="topcoat-icon topcoat-icon--back"></span>
         </a>
     </div>
@@ -21,7 +21,7 @@ <h2 class="topcoat-navigation-bar__title bg-lightblue" style="overflow:visible;"
 <div class="control-row"><label class="topcoat-radio-button"><input type="radio" id="customLanguage" name="topcoat">
     <div class="topcoat-radio-button__checkmark"></div> {{ t 'view.lblUseCustomLanguage'}} 
     </label>
-    <select id="language" class="docNav" style="margin-left:2em; margin=top: 6px;">
+    <select id="language" class="docNav" style="margin-left:2em; margin-top: 6px;">
         <option value="en">{{ t 'view.lblEnglish'}}</option>
         <option value="es">{{ t 'view.lblSpanish'}}</option>
         <option value="fr">{{ t 'view.lblFrench'}}</option>