inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-06-30 18:15:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-3861] Make datatable 508 compliance according (#4375)

Browse Source 
* [ADF-3861] Make datatable 508 compliance according

* [ADF-3861] Rebase branch
This commit is contained in:
davidcanonieto 2019-03-01 18:57:25 +01:00 committed by Eugenio Romano
parent 7da9bd89cb
commit 222b42d5b4
3 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
lib/core/datatable/components/datatable/datatable.component.html
View File

@ -13,7 +13,7 @@
</div>
<!-- Columns -->
<div *ngIf="multiselect" class="adf-datatable-cell-header adf-datatable-checkbox">
<mat-checkbox [checked]="isSelectAllChecked" (change)="onSelectAllClick($event)"></mat-checkbox>
<mat-checkbox [checked]="isSelectAllChecked" (change)="onSelectAllClick($event)" class="adf-checkbox-sr-only">{{ 'ADF-DATATABLE.ACCESSIBILITY.SELECT_ALL' | translate }}</mat-checkbox>
</div>
<div class="adf-datatable-cell--{{col.type || 'text'}} {{col.cssClass}} adf-datatable-cell-header"
*ngFor="let col of data.getColumns()"
@ -81,7 +81,9 @@
[checked]="row.isSelected"
[attr.aria-checked]="row.isSelected"
role="checkbox"
(change)="onCheckboxChange(row, $event)">
(change)="onCheckboxChange(row, $event)"
class="adf-checkbox-sr-only">
{{ 'ADF-DATATABLE.ACCESSIBILITY.SELECT_FILE' | translate }}
</mat-checkbox>
</div>
<div *ngFor="let col of data.getColumns()"

12
lib/core/datatable/components/datatable/datatable.component.scss
View File

@ -462,6 +462,18 @@
}
/* [Accessibility] Material checkbox labels */
.adf-checkbox-sr-only .mat-checkbox-label {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
.adf-sticky-header {
border-top: 0;
.adf-datatable-header {

4
lib/core/i18n/en.json
View File

@ -237,6 +237,10 @@
},
"CONTENT-ACTIONS": {
"TOOLTIP": "Content actions"
},
"ACCESSIBILITY": {
"SELECT_ALL": "Select all",
"SELECT_FILE": "Select file"
}
},
"USER_PROFILE": {