From 617fd9ab17c9b18794aa1f293b22548869da7939 Mon Sep 17 00:00:00 2001
From: Jan Skovgaard <jaskov@gmail.com>
Date: Wed, 14 Aug 2019 17:47:13 +0200
Subject: [PATCH] =?UTF-8?q?Accessibility:=20Open=20Package=20-=20Identifie?=
 =?UTF-8?q?s=20back=20button=20as=20"Left=20h=E2=80=A6=20(#5930)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/less/components/umb-packages.less              |  8 ++++++--
 .../views/dashboard/settings/examinemanagement.html    |  4 ++--
 .../src/views/packages/views/install-local.html        | 10 +++++-----
 .../src/views/packages/views/installed.html            |  2 +-
 .../src/views/packages/views/repo.html                 |  6 +++---
 .../src/views/users/views/users/users.html             |  6 +++---
 6 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-packages.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-packages.less
index f704dd48e2..16457787a3 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-packages.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-packages.less
@@ -264,12 +264,16 @@
     flex-flow: row wrap;
 }
 
-a.umb-package-details__back-link {
+.umb-package-details__back-action {
     font-weight: bold;
     color: @black;
+    padding: 0;
+    border: 0;
+    background-color: transparent;
 }
 
-.umb-package-details__back-link:hover {
+.umb-package-details__back-action:focus,
+.umb-package-details__back-action:hover {
     color: @gray-4;
     text-decoration: none;
 }
diff --git a/src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagement.html b/src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagement.html
index 6a7e65f7ae..6b7e3f4519 100644
--- a/src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagement.html
+++ b/src/Umbraco.Web.UI.Client/src/views/dashboard/settings/examinemanagement.html
@@ -89,7 +89,7 @@
 
             <umb-editor-sub-header>
                 <umb-editor-sub-header-content-left>
-                    <a class="umb-panel-back-link" href="" ng-click="vm.setViewState('list');">&larr; Back to overview</a>
+                        <button type="button" class="umb-package-details__back-action" ng-click="vm.setViewState('list');"><span aria-hidden="true">&larr;</span> <localize key="general_backToOverview">Back to overview</localize></button>
                 </umb-editor-sub-header-content-left>
             </umb-editor-sub-header>
 
@@ -198,7 +198,7 @@
 
             <umb-editor-sub-header>
                 <umb-editor-sub-header-content-left>
-                    <a class="umb-panel-back-link" href="" ng-click="vm.setViewState('list');">&larr; <localize key="general_backToOverview">Back to overview</localize></a>
+                    <button type="button" class="umb-package-details__back-action" ng-click="vm.setViewState('list');"><span aria-hidden="true">&larr;</span> <localize key="general_backToOverview">Back to overview</localize></button>
                 </umb-editor-sub-header-content-left>
             </umb-editor-sub-header>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/packages/views/install-local.html b/src/Umbraco.Web.UI.Client/src/views/packages/views/install-local.html
index dae57467c6..e22cfd14ab 100644
--- a/src/Umbraco.Web.UI.Client/src/views/packages/views/install-local.html
+++ b/src/Umbraco.Web.UI.Client/src/views/packages/views/install-local.html
@@ -36,9 +36,9 @@
                              ngf-max-size="{{ maxFileSize }}">
                             - <localize key="packager_orClickHereToUpload">or click here to choose files</localize>
                         </div>
-                        
+
                     </div>
-                    
+
                 </div>
 
                 <h3><strong><localize key="packager_uploadPackage">Upload package</localize></strong></h3>
@@ -54,7 +54,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.state = 'upload'">&larr; <localize key="packager_uploadAnother">Upload another package</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.state = 'upload'" prevent-default><span aria-hidden="true">&larr;</span> <localize key="packager_uploadAnother">Upload another package</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
@@ -76,7 +76,7 @@
                         <div class="umb-info-local-item text-error mt3" ng-if="vm.zipFile.uploadStatus === 'error'">
                             {{ vm.zipFile.serverErrorMessage }}
                         </div>
-                        
+
                     </div>
                 </div>
             </div>
@@ -89,7 +89,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.state = 'upload'">&larr; <localize key="packager_cancelAndUploadAnother">Cancel and upload another package</localize></a>
+                <button type="button" class="umb-package-details__back-action" href="" ng-click="vm.state = 'upload'" prevent-default><span aria-hidden="true">&larr;</span> <localize key="packager_cancelAndUploadAnother">Cancel and upload another package</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html b/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
index 1c87eb469a..3668c7f0df 100644
--- a/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
+++ b/src/Umbraco.Web.UI.Client/src/views/packages/views/installed.html
@@ -58,7 +58,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.state = 'list'">&larr; <localize key="general_back">Back</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.state = 'list'" prevent-default><span aria-hidden="true">&larr;</span> <localize key="general_back">Back</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/packages/views/repo.html b/src/Umbraco.Web.UI.Client/src/views/packages/views/repo.html
index 4767f6fdcc..d0c0c3744c 100644
--- a/src/Umbraco.Web.UI.Client/src/views/packages/views/repo.html
+++ b/src/Umbraco.Web.UI.Client/src/views/packages/views/repo.html
@@ -119,7 +119,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.setPackageViewState('packageList');">&larr; <localize key="general_back">Back</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.setPackageViewState('packageList');" prevent-default><span aria-hidden="true">&larr;</span> <localize key="general_back">Back</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
@@ -185,7 +185,7 @@
                                     img-src="{{ 'https://our.umbraco.org' + vm.package.ownerInfo.ownerAvatar }}">
                                 </umb-avatar>
                                 </div>
-    
+
                                 <div>
                                     <div class="umb-package-details__owner-profile-name">{{ vm.package.ownerInfo.owner }}</div>
                                     <div class="umb-package-details__owner-profile-karma">
@@ -287,7 +287,7 @@
     <div ng-if="vm.packageViewState === 'packageInstall' && vm.loading === false">
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.setPackageViewState('packageDetails');">&larr; <localize key="general_back">Back</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.setPackageViewState('packageDetails');" prevent-default><span aria-hidden="true">&larr;</span> <localize key="general_back">Back</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
index 4cab09da60..71df45c28f 100644
--- a/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
+++ b/src/Umbraco.Web.UI.Client/src/views/users/views/users/users.html
@@ -285,7 +285,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.setUsersViewState('overview');">&larr; <localize key="user_backToUsers">Back to users</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.setUsersViewState('overview');"><span aria-hidden="true">&larr;</span> <localize key="user_backToUsers">Back to users</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
@@ -408,7 +408,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.setUsersViewState('overview');">&larr; <localize key="user_backToUsers">Back to users</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.setUsersViewState('overview');"><span aria-hidden="true">&larr;</span> <localize key="user_backToUsers">Back to users</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>
 
@@ -490,7 +490,7 @@
     <div ng-if="vm.usersViewState === 'inviteUserSuccess'">
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <a class="umb-package-details__back-link" href="" ng-click="vm.setUsersViewState('overview');">&larr; <localize key="user_backToUsers">Back to users</localize></a>
+                <button type="button" class="umb-package-details__back-action" ng-click="vm.setUsersViewState('overview');"><span aria-hidden="true">&larr;</span> <localize key="user_backToUsers">Back to users</localize></button>
             </umb-editor-sub-header-content-left>
         </umb-editor-sub-header>