Links components (e.g. 'Footer links'), 'Add' is identfied as "Add li…

…nk" but doesn't identify the label (#6304)
umbraco · Sep 15, 2019 · 41c4f12 · 41c4f12
1 parent de656ac
commit 41c4f12
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 8 deletions.
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-node-preview.less
@@ -92,11 +92,13 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    background: transparent;
     border: 1px dashed @ui-action-discreet-border;
     color: @ui-action-discreet-type;
     font-weight: bold;
     padding: 5px 15px;
     box-sizing: border-box;
+    width: 100%;
 }
 
 .umb-node-preview-add:hover {

diff --git a/...Umbraco.Web.UI.Client/src/views/propertyeditors/contentpicker/contentpicker.controller.js b/...Umbraco.Web.UI.Client/src/views/propertyeditors/contentpicker/contentpicker.controller.js
@@ -16,7 +16,8 @@ function contentPickerController($scope, entityResource, editorState, iconHelper
 
     var vm = {
         labels: {
-            general_recycleBin: ""
+            general_recycleBin: "",
+            general_add: ""
         }
     };
 
@@ -78,6 +79,8 @@ function contentPickerController($scope, entityResource, editorState, iconHelper
     $scope.renderModel = [];
     $scope.sortableModel = [];
 
+    $scope.labels = vm.labels;
+
     $scope.dialogEditor = editorState && editorState.current && editorState.current.isDialogEditor === true;
 
     //the default pre-values
@@ -479,9 +482,10 @@ function contentPickerController($scope, entityResource, editorState, iconHelper
     }
 
     function init() {
-        localizationService.localizeMany(["general_recycleBin"])
+        localizationService.localizeMany(["general_recycleBin", "general_add"])
             .then(function(data) {
                 vm.labels.general_recycleBin = data[0];
+                vm.labels.general_add = data[1];
 
                 syncRenderModel(false).then(function () {
                     //everything is loaded, start the watch on the model

diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/contentpicker/contentpicker.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/contentpicker/contentpicker.html
@@ -19,13 +19,17 @@
             </umb-node-preview>
         </div>
 
-        <a ng-show="model.config.multiPicker === true && renderModel.length < model.config.maxNumber || renderModel.length === 0 || !model.config.maxNumber"
-           class="umb-node-preview-add"
-           href=""
-           ng-click="openCurrentPicker()"
-           prevent-default>
+        <button
+            ng-show="model.config.multiPicker === true && renderModel.length < model.config.maxNumber || renderModel.length === 0 || !model.config.maxNumber"
+            type="button"
+            class="umb-node-preview-add"
+            ng-click="openCurrentPicker()"
+            id="{{model.alias}}"
+            aria-label="{{model.label}}: {{labels.general_add}}"
+            aria-haspopup="dialog"
+        >
             <localize key="general_add">Add</localize>
-        </a>
+        </button>
 
         <div class="umb-contentpicker__min-max-help" ng-if="model.config.multiPicker === true">