From f33c43609f9afa29a44cbb8a56ba717aa52d06d6 Mon Sep 17 00:00:00 2001
From: Jan Skovgaard <1932158+BatJan@users.noreply.github.com>
Date: Mon, 31 Aug 2020 20:30:47 +0200
Subject: [PATCH] General markup cleanup on buttons and icons (#8746)

---
 .../components/umbdropdown.directive.js       |  4 ++--
 .../util/umbkeyboardlist.directive.js         | 20 +++++++++----------
 .../notifications/umb-notifications.html      |  2 +-
 .../views/components/umb-groups-builder.html  |  4 ++--
 .../src/views/datatypes/create.html           | 12 +++++------
 .../src/views/documenttypes/create.html       | 16 +++++++--------
 .../src/views/mediatypes/create.html          | 10 +++++-----
 .../src/views/membertypes/create.html         |  6 +++---
 .../views/packages/views/install-local.html   |  2 +-
 .../src/views/partialviewmacros/create.html   | 20 +++++++++----------
 .../src/views/scripts/create.html             | 10 +++++-----
 .../src/views/stylesheets/create.html         | 14 ++++++-------
 12 files changed, 60 insertions(+), 60 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdropdown.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdropdown.directive.js
index d6006114a6..cfba5be2ce 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdropdown.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbdropdown.directive.js
@@ -22,7 +22,7 @@
             <umb-dropdown ng-if="vm.dropdownOpen" on-close="vm.close()" umb-keyboard-list>
                 <umb-dropdown-item
                     ng-repeat="item in vm.items">
-                    <a href="" ng-click="vm.select(item)">{{ item.name }}</a>
+                    <button type="button" class="btn-reset" ng-click="vm.select(item)">{{ item.name }}</button>
                 </umb-dropdown-item>
             </umb-dropdown>
 
@@ -110,7 +110,7 @@
 
             // Stop listening when scope is destroyed.
             scope.$on('$destroy', stopListening);
-            
+
         }
 
         var directive = {
diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/util/umbkeyboardlist.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/util/umbkeyboardlist.directive.js
index 20572fdf16..0b743d0f10 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/util/umbkeyboardlist.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/util/umbkeyboardlist.directive.js
@@ -10,12 +10,12 @@
 <pre>
     <div>
         <ul umb-keyboard-list>
-            <li><a href="">Item 1</a></li>
-            <li><a href="">Item 2</a></li>
-            <li><a href="">Item 3</a></li>
-            <li><a href="">Item 4</a></li>
-            <li><a href="">Item 5</a></li>
-            <li><a href="">Item 6</a></li>
+            <li><button type="button" class="btn-reset">Item 1</button></li>
+            <li><button type="button" class="btn-reset">Item 2</button></li>
+            <li><button type="button" class="btn-reset">Item 3</button></li>
+            <li><button type="button" class="btn-reset">Item 4</button></li>
+            <li><button type="button" class="btn-reset">Item 5</button></li>
+            <li><button type="button" class="btn-reset">Item 6</button></li>
         </ul>
     </div>
 </pre>
@@ -33,11 +33,11 @@ angular.module('umbraco.directives')
         return {
             restrict: 'A',
             link: function (scope, element, attr) {
-                
+
                 var listItems = [];
                 var currentIndex = 0;
                 var focusSet = false;
-            
+
                 $timeout(function(){
                     // get list of all links in the list
                     listItems = element.find("li :tabbable");
@@ -82,7 +82,7 @@ angular.module('umbraco.directives')
 
                 function arrowDown() {
                     if (currentIndex < listItems.length - 1) {
-                        // only bump the current index if the focus is already 
+                        // only bump the current index if the focus is already
                         // set else we just want to focus the first element
                         if (focusSet) {
                             currentIndex++;
@@ -112,4 +112,4 @@ angular.module('umbraco.directives')
 
             }
         };
-    }]);
\ No newline at end of file
+    }]);
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/notifications/umb-notifications.html b/src/Umbraco.Web.UI.Client/src/views/components/notifications/umb-notifications.html
index 349384f713..37cd736830 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/notifications/umb-notifications.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/notifications/umb-notifications.html
@@ -20,7 +20,7 @@
             </div>
 
             <button type="button" class="close -align-right" ng-click="removeNotification($index)" aria-hidden="true">
-                <span aria-hidden="true">&times;</span>
+                <span>&times;</span>
             </button>
         </li>
     </ul>
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
index 0067fa1327..d722fba7be 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
@@ -44,7 +44,7 @@
         <li ng-repeat="tab in model.groups" ng-class="{'umb-group-builder__group-sortable': sortingMode}" data-element="group-{{tab.name}}">
 
             <!-- TAB INIT STATE -->
-            <button href="" class="umb-group-builder__group -placeholder" hotkey="alt+shift+g" ng-click="addGroup(tab)" ng-if="tab.tabState=='init' && !sortingMode" data-element="group-add">
+            <button type="button" class="umb-group-builder__group -placeholder" hotkey="alt+shift+g" ng-click="addGroup(tab)" ng-if="tab.tabState=='init' && !sortingMode" data-element="group-add">
                 <localize key="contentTypeEditor_addGroup"></localize>
             </button>
 
@@ -117,7 +117,7 @@
                     <li data-element="property-{{property.alias}}" ng-class="{'umb-group-builder__property-sortable': sortingMode && !property.inherited}" ng-repeat="property in tab.properties">
 
                         <!-- Add new property -->
-                        <button href=""
+                        <button type="button"
                             data-element="property-add"
                             class="umb-group-builder__group-add-property"
                             ng-if="property.propertyState=='init' && !sortingMode"
diff --git a/src/Umbraco.Web.UI.Client/src/views/datatypes/create.html b/src/Umbraco.Web.UI.Client/src/views/datatypes/create.html
index 55039831ac..00a2bab648 100644
--- a/src/Umbraco.Web.UI.Client/src/views/datatypes/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/datatypes/create.html
@@ -4,18 +4,18 @@
         <div class="umb-pane" ng-if="!model.creatingFolder">
             <h5><localize key="create_createUnder">Create an item under</localize> {{currentNode.name}}</h5>
 
-            <ul class="umb-actions umb-actions-child">           
+            <ul class="umb-actions umb-actions-child">
                 <li data-element="action-data-type" class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" ng-click="createDataType()" umb-auto-focus>
-                        <i class="large icon icon-autofill"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="createDataType()" umb-auto-focus>
+                        <i class="large icon icon-autofill" aria-hidden="true"></i>
                         <span class="menu-label">
                             <localize key="create_newDataType">New data type</localize>
                         </span>
                     </button>
                 </li>
                 <li data-element="action-folder" class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" ng-click="showCreateFolder()">
-                        <i class="large icon icon-folder"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="showCreateFolder()">
+                        <i class="large icon icon-folder" aria-hidden="true"></i>
                         <span class="menu-label">
                             <localize key="create_newFolder">New folder</localize>...
                         </span>
@@ -40,7 +40,7 @@
     </div>
 
     <div class="umb-dialog-footer btn-toolbar umb-btn-toolbar" ng-if="!model.creatingFolder">
-        <button class="btn btn-info" ng-click="close()">
+        <button type="button" class="btn btn-info" ng-click="close()">
             <localize key="buttons_somethingElse">Do something else</localize>
         </button>
     </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/documenttypes/create.html b/src/Umbraco.Web.UI.Client/src/views/documenttypes/create.html
index e824608dd1..928431f7bd 100644
--- a/src/Umbraco.Web.UI.Client/src/views/documenttypes/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/documenttypes/create.html
@@ -7,16 +7,16 @@
 
             <ul class="umb-actions umb-actions-child">
                 <li data-element="action-documentType" class="umb-action" ng-hide="model.disableTemplates">
-                    <button href="" ng-click="createDocType()" class="umb-action-link umb-outline btn-reset" umb-auto-focus>
-                        <i class="large icon icon-item-arrangement"></i>
+                    <button type="button" ng-click="createDocType()" class="umb-action-link umb-outline btn-reset" umb-auto-focus>
+                        <i class="large icon icon-item-arrangement" aria-hidden="true"></i>
                         <span class="menu-label">
                             <localize key="content_documentType">Document type</localize>
                         </span>
                     </button>
                 </li>
                 <li data-element="action-documentTypeWithoutTemplate" class="umb-action">
-                    <button href="" ng-click="createComponent()" class="umb-action-link umb-outline btn-reset">
-                        <i class="large icon icon-item-arrangement"></i>
+                    <button type="button" ng-click="createComponent()" class="umb-action-link umb-outline btn-reset">
+                        <i class="large icon icon-item-arrangement" aria-hidden="true"></i>
                         <span class="menu-label">
                             <localize ng-if="model.disableTemplates === false" key="create_documentTypeWithoutTemplate"></localize>
                             <localize ng-if="model.disableTemplates === true" key="content_documentType">Document type></localize>
@@ -24,8 +24,8 @@
                     </button>
                 </li>
                 <li data-element="action-documentTypeCollection" class="umb-action">
-                    <button href="" ng-click="showCreateDocTypeCollection()" class="umb-action-link umb-outline btn-reset">
-                        <i class="large icon icon-thumbnail-list"></i>
+                    <button type="button" ng-click="showCreateDocTypeCollection()" class="umb-action-link umb-outline btn-reset">
+                        <i class="large icon icon-thumbnail-list" aria-hidden="true"></i>
                         <span class="menu-label">
                             Document Type Collection...
                             <!--<localize key="content_documentType_collection">Document Type Collection</localize>-->
@@ -33,8 +33,8 @@
                     </button>
                 </li>
                 <li data-element="action-folder" ng-if="model.allowCreateFolder" class="umb-action">
-                    <button href="" ng-click="showCreateFolder()" class="umb-action-link umb-outline btn-reset">
-                        <i class="large icon icon-folder"></i>
+                    <button type="button" ng-click="showCreateFolder()" class="umb-action-link umb-outline btn-reset">
+                        <i class="large icon icon-folder" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="general_folder"></localize>...</span>
                     </button>
                 </li>
diff --git a/src/Umbraco.Web.UI.Client/src/views/mediatypes/create.html b/src/Umbraco.Web.UI.Client/src/views/mediatypes/create.html
index 4c0b8bb6ae..8e11762b9a 100644
--- a/src/Umbraco.Web.UI.Client/src/views/mediatypes/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/mediatypes/create.html
@@ -5,10 +5,10 @@
         <div class="umb-pane" ng-if="!model.creatingFolder">
             <h5><localize key="create_createUnder">Create an item under</localize> {{currentNode.name}}</h5>
 
-            <ul class="umb-actions umb-actions-child">           
+            <ul class="umb-actions umb-actions-child">
                 <li class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" ng-click="createMediaType()" umb-auto-focus>
-                        <i class="large icon icon-item-arrangement"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="createMediaType()" umb-auto-focus>
+                        <i class="large icon icon-item-arrangement" aria-hidden="true"></i>
                         <span class="menu-label">
                             <localize key="general_new">New</localize>
                             <localize key="content_mediatype">Media type</localize>
@@ -16,8 +16,8 @@
                     </button>
                 </li>
                 <li class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" ng-click="showCreateFolder()">
-                        <i class="large icon icon-folder"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="showCreateFolder()">
+                        <i class="large icon icon-folder" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="general_folder"></localize>...</span>
                     </button>
                 </li>
diff --git a/src/Umbraco.Web.UI.Client/src/views/membertypes/create.html b/src/Umbraco.Web.UI.Client/src/views/membertypes/create.html
index 5964bdb75e..46b51b5f34 100644
--- a/src/Umbraco.Web.UI.Client/src/views/membertypes/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/membertypes/create.html
@@ -5,13 +5,13 @@
 
         <ul class="umb-actions umb-actions-child">
             <li class="umb-action">
-                <button href="" class="umb-action-link umb-outline btn-reset" ng-click="showCreateFolder()">
-                    <i class="large icon icon-folder"></i>
+                <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="showCreateFolder()">
+                    <i class="large icon icon-folder" aria-hidden="true"></i>
                     <span class="menu-label"><localize key="general_folder"></localize></span>
                 </button>
             </li>
             <li class="umb-action">
-                <button href="" class="umb-action-link umb-outline btn-reset" ng-click="createMemberType()">
+                <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="createMemberType()">
 
                     <i class="large icon icon-item-arrangement"></i>
 
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 26ce047d8a..dea6dfac43 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
@@ -88,7 +88,7 @@
 
         <umb-editor-sub-header>
             <umb-editor-sub-header-content-left>
-                <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>
+                <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_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/partialviewmacros/create.html b/src/Umbraco.Web.UI.Client/src/views/partialviewmacros/create.html
index bd91585d4e..f7c1280094 100644
--- a/src/Umbraco.Web.UI.Client/src/views/partialviewmacros/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/partialviewmacros/create.html
@@ -11,26 +11,26 @@
 
                 <ul class="umb-actions umb-actions-child">
                     <li class="umb-action">
-                        <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.createFile()" umb-auto-focus>
-                            <i class="large icon-article"></i>
+                        <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.createFile()" umb-auto-focus>
+                            <i class="large icon-article" aria-hidden="true"></i>
                             <span class="menu-label"><localize key="create_newPartialViewMacro">New partial view macro</localize></span>
                         </button>
                     </li>
                     <li class="umb-action">
-                        <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.createFileWithoutMacro()">
-                            <i class="large icon icon-article"></i>
+                        <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.createFileWithoutMacro()">
+                            <i class="large icon icon-article" aria-hidden="true"></i>
                             <span class="menu-label"><localize key="create_newPartialViewMacroNoMacro">New partial view macro (without macro)</localize></span>
                         </button>
                     </li>
                     <li class="umb-action">
-                        <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFromSnippet()">
-                            <i class="large icon icon-article"></i>
+                        <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFromSnippet()">
+                            <i class="large icon icon-article" aria-hidden="true"></i>
                             <span class="menu-label"><localize key="create_newPartialViewMacroFromSnippet">>New partial view macro from snippet</localize>...</span>
                         </button>
                     </li>
                     <li class="umb-action">
-                        <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFolder()">
-                            <i class="large icon icon-folder"></i>
+                        <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFolder()">
+                            <i class="large icon icon-folder" aria-hidden="true"></i>
                             <span class="menu-label"><localize key="general_folder"></localize>...</span>
                         </button>
                     </li>
@@ -44,8 +44,8 @@
 
                 <ul class="umb-actions umb-actions-child">
                     <li class="umb-action" ng-repeat="snippet in vm.snippets">
-                        <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.createFileFromSnippet(snippet)" style="padding-top: 6px; padding-bottom: 6px;">
-                            <i class="icon-article icon" style="font-size: 20px;"></i>
+                        <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.createFileFromSnippet(snippet)" style="padding-top: 6px; padding-bottom: 6px;">
+                            <i class="icon-article icon" style="font-size: 20px;" aria-hidden="true"></i>
                             <span class="menu-label" style="margin-left: 0; padding-left: 5px;">{{ snippet.name }}</span>
                         </button>
                     </li>
diff --git a/src/Umbraco.Web.UI.Client/src/views/scripts/create.html b/src/Umbraco.Web.UI.Client/src/views/scripts/create.html
index 7d2896f606..b9f355f092 100644
--- a/src/Umbraco.Web.UI.Client/src/views/scripts/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/scripts/create.html
@@ -7,14 +7,14 @@
 
             <ul class="umb-actions umb-actions-child">
                 <li class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" umb-auto-focus ng-click="vm.createFile()">
-                        <i class="large icon icon-script"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" umb-auto-focus ng-click="vm.createFile()">
+                        <i class="large icon icon-script" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="create_newJavascriptFile">New javascript file</localize></span>
                     </button>
                 </li>
                 <li class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFolder()">
-                        <i class="large icon icon-folder"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFolder()">
+                        <i class="large icon icon-folder" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="general_folder"></localize>...</span>
                     </button>
                 </li>
@@ -26,7 +26,7 @@
             <form novalidate name="createFolderForm"
                 ng-submit="vm.createFolder(createFolderForm)"
                 val-form-manager>
-                
+
                 <div ng-show="vm.createFolderError">
                     <div class="alert alert-error">
                         <div>{{vm.createFolderError.data.message}}</div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/stylesheets/create.html b/src/Umbraco.Web.UI.Client/src/views/stylesheets/create.html
index 4c7f62e17f..cf0b6906ca 100644
--- a/src/Umbraco.Web.UI.Client/src/views/stylesheets/create.html
+++ b/src/Umbraco.Web.UI.Client/src/views/stylesheets/create.html
@@ -7,20 +7,20 @@
 
             <ul class="umb-actions umb-actions-child">
                 <li class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" umb-auto-focus ng-click="vm.createFile()">
-                        <i class="large icon icon-script"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" umb-auto-focus ng-click="vm.createFile()">
+                        <i class="large icon icon-script" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="create_newStyleSheetFile">New style sheet file</localize></span>
                     </button>
                 </li>
                 <li class="umb-action">
-                    <button href="" ng-click="vm.createRichtextStyle()" class="umb-action-link umb-outline btn-reset">
-                        <i class="large icon icon-script"></i>
+                    <button type="button" ng-click="vm.createRichtextStyle()" class="umb-action-link umb-outline btn-reset">
+                        <i class="large icon icon-script" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="create_newRteStyleSheetFile">New richtext style sheet file</localize></span>
                     </button>
                 </li>
                 <li class="umb-action">
-                    <button href="" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFolder()">
-                        <i class="large icon icon-folder"></i>
+                    <button type="button" class="umb-action-link umb-outline btn-reset" ng-click="vm.showCreateFolder()">
+                        <i class="large icon icon-folder" aria-hidden="true"></i>
                         <span class="menu-label"><localize key="general_folder"></localize>...</span>
                     </button>
                 </li>
@@ -50,7 +50,7 @@
     </div>
 
     <div class="umb-dialog-footer btn-toolbar umb-btn-toolbar" ng-hide="vm.creatingFolder">
-        <button class="btn btn-info" ng-click="vm.close()">
+        <button type="button" class="btn btn-info" ng-click="vm.close()">
             <localize key="buttons_somethingElse">Do something else</localize>
         </button>
     </div>