mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-06-30 18:14:45 +00:00
action icons accessibility
This commit is contained in:
parent
5deb24ad16
commit
a1224d2f72
@ -35,10 +35,18 @@ import {
|
||||
@Component({
|
||||
selector: 'app-document-display-mode',
|
||||
template: `
|
||||
<button mat-icon-button color="primary" (click)="onClick()">
|
||||
<mat-icon *ngIf="(displayMode$ | async) === 'list'">view_comfy</mat-icon>
|
||||
<mat-icon *ngIf="(displayMode$ | async) === 'gallery'">list</mat-icon>
|
||||
</button>
|
||||
<ng-container *ngIf="displayMode$ | async as displayMode">
|
||||
<button
|
||||
[attr.title]="getTitle(displayMode) | translate"
|
||||
[attr.aria-label]="getTitle(displayMode) | translate"
|
||||
mat-icon-button
|
||||
color="primary"
|
||||
(click)="onClick()"
|
||||
>
|
||||
<mat-icon *ngIf="displayMode === 'list'">view_comfy</mat-icon>
|
||||
<mat-icon *ngIf="displayMode === 'gallery'">list</mat-icon>
|
||||
</button>
|
||||
</ng-container>
|
||||
`,
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
host: { class: 'app-document-display-mode' }
|
||||
@ -50,6 +58,12 @@ export class DocumentDisplayModeComponent {
|
||||
this.displayMode$ = store.select(getDocumentDisplayMode);
|
||||
}
|
||||
|
||||
getTitle(displayMode: string): string {
|
||||
return displayMode === 'list'
|
||||
? 'APP.ACTIONS.LIST_MODE'
|
||||
: 'APP.ACTIONS.GALLERY_MODE';
|
||||
}
|
||||
|
||||
onClick() {
|
||||
this.store.dispatch(new ToggleDocumentDisplayMode());
|
||||
}
|
||||
|
@ -37,6 +37,7 @@ import {
|
||||
<button
|
||||
mat-icon-button
|
||||
[color]="(infoDrawerOpened$ | async) ? 'primary' : ''"
|
||||
[attr.aria-label]="'APP.ACTIONS.DETAILS' | translate"
|
||||
[attr.title]="'APP.ACTIONS.DETAILS' | translate"
|
||||
(click)="onClick()"
|
||||
>
|
||||
|
@ -4,6 +4,7 @@
|
||||
[id]="actionRef.id"
|
||||
mat-icon-button
|
||||
[color]="color"
|
||||
[attr.aria-label]="actionRef.description || actionRef.title | translate"
|
||||
[attr.title]="actionRef.description || actionRef.title | translate"
|
||||
(click)="runAction()"
|
||||
>
|
||||
|
@ -2,6 +2,7 @@
|
||||
[id]="actionRef.id"
|
||||
[color]="color"
|
||||
mat-icon-button
|
||||
[attr.aria-label]="actionRef.description || actionRef.title | translate"
|
||||
[attr.title]="actionRef.description || actionRef.title | translate"
|
||||
[matMenuTriggerFor]="menu"
|
||||
>
|
||||
|
@ -40,6 +40,7 @@ import { SharedLinkEntry } from '@alfresco/js-api';
|
||||
<button
|
||||
*ngIf="data.iconButton"
|
||||
mat-icon-button
|
||||
[attr.aria-label]="data.title | translate"
|
||||
[attr.title]="data.title | translate"
|
||||
(click)="onClick()"
|
||||
>
|
||||
|
@ -211,7 +211,9 @@
|
||||
"CANCEL_JOIN": "Cancel Join Request",
|
||||
"LEAVE": "Leave Library",
|
||||
"EDIT_OFFLINE": "Edit Offline",
|
||||
"EDIT_OFFLINE_CANCEL": "Cancel Editing"
|
||||
"EDIT_OFFLINE_CANCEL": "Cancel Editing",
|
||||
"LIST_MODE": "View list",
|
||||
"GALLERY_MODE": "View gallery"
|
||||
},
|
||||
"DIALOGS": {
|
||||
"CONFIRM_PURGE": {
|
||||
|
Loading…
x
Reference in New Issue
Block a user