IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-02-25 18:55:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

Ensure that toggle buttons are accessible by most screen readers. Fixes #6317

Browse Source
This commit is contained in:
Khushboo Vashi
2021-03-19 11:44:57 +05:30
committed by Akshay Joshi
parent ded65340fe
commit b973d6055d
2 changed files with 4 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/pgadmin/static/js/backform.pgadmin.js
View File

@@ -587,7 +587,6 @@ define([
},
template: _.template([
'<span class="<%=controlLabelClassName%>"><%=label%></span>',
'<label class="sr-value sr-only" for="<%=cId%>"></label>',
'<div class="<%=controlsClassName%> <%=extraClasses.join(\' \')%>">',
' <input tabindex="-1" type="checkbox" aria-hidden="true" aria-label="' + gettext('Toggle button') + '" data-style="quick" data-toggle="toggle"',
' data-size="<%=options.size%>" data-height="<%=options.height%>" ',
@@ -615,11 +614,11 @@ define([
if(this.$el.find('.toggle.btn').hasClass('off')) {
this.$el.find('.sr-value').text(`
${label}, ${offText}, ` + gettext('Toggle button') + `
${label}, ${offText}, ` + gettext('Toggle') + `
`);
} else {
this.$el.find('.sr-value').text(`
${label}, ${onText}, ` + gettext('Toggle button') + `
${label}, ${onText}, ` + gettext('Toggle') + `
`);
}
},
@@ -693,6 +692,7 @@ define([
.attr('id', data.cId);
this.$el.find('.toggle.btn .toggle-group .btn').attr('aria-hidden', true);
this.$el.find('div.toggle').append('<label class="sr-value sr-only" for="<%=cId%>"></label>');
this.setSrValue();
this.updateInvalid();