[ACS-3552] Accessibility fixes for CSV file issues (#2705)

* [ACS-3552] Accessibility fixes for CSV file issues

* [ACS-3552] Fix tabindex attribute values
This commit is contained in:
MichalKinas 2022-10-12 00:46:10 +02:00 committed by GitHub
parent 27eeb0a20a
commit 3e44f46575
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 18 additions and 8 deletions

View File

@ -73,7 +73,7 @@
<adf-custom-empty-content-template *ngIf="isFilterHeaderActive()"> <adf-custom-empty-content-template *ngIf="isFilterHeaderActive()">
<ng-container> <ng-container>
<div class="empty-search__block"> <div class="empty-search__block" aria-live="polite">
<p class="empty-search__text"> <p class="empty-search__text">
{{ 'APP.BROWSE.SEARCH.NO_FILTER_RESULTS' | translate }} {{ 'APP.BROWSE.SEARCH.NO_FILTER_RESULTS' | translate }}
</p> </p>

View File

@ -69,7 +69,7 @@
<adf-custom-empty-content-template> <adf-custom-empty-content-template>
<ng-container *ngIf="data"> <ng-container *ngIf="data">
<div class="empty-search__block"> <div class="empty-search__block" aria-live="polite">
<p class="empty-search__text"> <p class="empty-search__text">
{{ 'APP.BROWSE.SEARCH.NO_RESULTS' | translate }} {{ 'APP.BROWSE.SEARCH.NO_RESULTS' | translate }}
</p> </p>

View File

@ -12,7 +12,7 @@
<div class="main-content"> <div class="main-content">
<div class="adf-search-results"> <div class="adf-search-results">
<div class="adf-search-results__content"> <div class="adf-search-results__content">
<mat-progress-bar *ngIf="isLoading" color="primary" mode="indeterminate"> </mat-progress-bar> <mat-progress-bar *ngIf="isLoading" color="primary" mode="indeterminate" aria-live="polite"> </mat-progress-bar>
<div class="adf-search-results__content-header content"> <div class="adf-search-results__content-header content">
<adf-search-form class="content__side--left"></adf-search-form> <adf-search-form class="content__side--left"></adf-search-form>
@ -20,9 +20,14 @@
<adf-search-filter-chips class="content__filter"></adf-search-filter-chips> <adf-search-filter-chips class="content__filter"></adf-search-filter-chips>
<button mat-button adf-reset-search <button
class="content__reset-action" mat-button
title="{{'APP.BROWSE.SEARCH.RESET_ACTION' | translate }}"><mat-icon> refresh </mat-icon></button> adf-reset-search
class="content__reset-action"
title="{{'APP.BROWSE.SEARCH.RESET_ACTION' | translate }}"
[attr.aria-label]="'APP.BROWSE.SEARCH.RESET_ACTION' | translate ">
<mat-icon> refresh </mat-icon>
</button>
</div> </div>
<adf-document-list <adf-document-list
@ -70,7 +75,7 @@
<adf-custom-empty-content-template> <adf-custom-empty-content-template>
<ng-container *ngIf="data"> <ng-container *ngIf="data">
<div class="empty-search__block"> <div class="empty-search__block" aria-live="polite">
<p class="empty-search__text"> <p class="empty-search__text">
{{ 'APP.BROWSE.SEARCH.NO_RESULTS' | translate }} {{ 'APP.BROWSE.SEARCH.NO_RESULTS' | translate }}
</p> </p>

View File

@ -197,3 +197,7 @@ $contrast-gray: #646569;
color: white; color: white;
} }
} }
.adf-empty-content__icon {
color: $contrast-gray;
}

View File

@ -1,6 +1,6 @@
<ng-container [ngSwitch]="actionRef.type"> <ng-container [ngSwitch]="actionRef.type">
<ng-container *ngSwitchCase="'menu'"> <ng-container *ngSwitchCase="'menu'">
<button [id]="actionRef.id" mat-menu-item role="menuitem" [disabled]="actionRef.disabled" [matMenuTriggerFor]="childMenu"> <button [id]="actionRef.id" mat-menu-item role="menuitem" tabindex="0" [disabled]="actionRef.disabled" [matMenuTriggerFor]="childMenu">
<adf-icon [value]="actionRef.icon"></adf-icon> <adf-icon [value]="actionRef.icon"></adf-icon>
<span data-automation-id="menu-item-title">{{ actionRef.title | translate }}</span> <span data-automation-id="menu-item-title">{{ actionRef.title | translate }}</span>
</button> </button>
@ -26,6 +26,7 @@
role="menuitem" role="menuitem"
mat-menu-item mat-menu-item
[role]="'menuitem'" [role]="'menuitem'"
tabindex="0"
[disabled]="actionRef.disabled" [disabled]="actionRef.disabled"
[attr.title]="(actionRef.disabled ? actionRef['description-disabled'] : actionRef.description || actionRef.title) | translate" [attr.title]="(actionRef.disabled ? actionRef['description-disabled'] : actionRef.description || actionRef.title) | translate"
(click)="runAction()" (click)="runAction()"