yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add aria label to umbraco property

Browse Source
This commit is contained in:
KNOWIT\anndal3
2023-10-03 18:10:58 +02:00
committed by Michael Latouche
parent b6f0db7b73
commit 612b6039f2
2 changed files with 4 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/Umbraco.Web.UI.Client/src/common/directives/components/property/umbproperty.directive.js
View File

@@ -64,10 +64,13 @@
function onInit() {
vm.controlLabelTitle = null;
vm.controlAriaLabel = null;
if (Umbraco.Sys.ServerVariables.isDebuggingEnabled) {
userService.getCurrentUser().then(function (u) {
if (u.allowedSections.indexOf("settings") !== -1 ? true : false) {
vm.controlLabelTitle = vm.property.alias;
// capitalize first letter of the alias for screen readers
vm.controlAriaLabel = vm.property.alias.charAt(0).toUpperCase() + vm.property.alias.slice(1);
}
});
}

2
src/Umbraco.Web.UI.Client/src/views/components/property/umb-property.html
View File

@@ -9,7 +9,7 @@
<div class="control-header" ng-hide="(vm.hideLabel || vm.property.hideLabel) === true">
<label data-element="property-label-{{vm.property.alias}}" class="control-label" for="{{vm.property.alias}}" ng-attr-title="{{vm.controlLabelTitle}}">{{vm.property.label}}<span ng-if="vm.property.validation.mandatory || vm.property.ncMandatory"><strong class="umb-control-required">*</strong></span></label>
<label data-element="property-label-{{vm.property.alias}}" class="control-label" for="{{vm.property.alias}}" ng-attr-title="{{vm.controlLabelTitle}}" aria-label="Property alias: {{vm.controlAriaLabel}}">{{vm.property.label}}<span ng-if="vm.property.validation.mandatory || vm.property.ncMandatory"><strong class="umb-control-required">*</strong></span></label>
<umb-property-actions actions="vm.propertyActions"></umb-property-actions>