mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
[ACS-3863] Edit aspect dialog accessibility issues (#7949)
* [ACS-3863] Edit aspect dialog accessibility issues * [ACS-3863] Fix: main landmark, allowed aria attribute accessibility issues * [ACS-3863] Addressed review comment
This commit is contained in:
parent
fa96a15be4
commit
afc6e19152
@ -1,7 +1,7 @@
|
|||||||
<header mat-dialog-title data-automation-id="aspect-list-dialog-title" class="adf-aspect-list-dialog">
|
<div mat-dialog-title data-automation-id="aspect-list-dialog-title" class="adf-aspect-list-dialog">
|
||||||
<h4 class="adf-aspect-list-dialog-title">{{title | translate}}</h4>
|
<h1 class="adf-aspect-list-dialog-title">{{title | translate}}</h1>
|
||||||
<div class="adf-aspect-list-dialog-description">{{description | translate}}</div>
|
<div class="adf-aspect-list-dialog-description">{{description | translate}}</div>
|
||||||
</header>
|
</div>
|
||||||
|
|
||||||
<div class="adf-aspect-list-dialog-information">
|
<div class="adf-aspect-list-dialog-information">
|
||||||
<p id="aspect-list-dialog-over-table-message">{{overTableMessage | translate}}</p>
|
<p id="aspect-list-dialog-over-table-message">{{overTableMessage | translate}}</p>
|
||||||
|
@ -7,8 +7,8 @@
|
|||||||
[checked]="nodeAspects?.includes(aspect?.entry?.id)"
|
[checked]="nodeAspects?.includes(aspect?.entry?.id)"
|
||||||
(click)="onCheckBoxClick($event)"
|
(click)="onCheckBoxClick($event)"
|
||||||
(change)="onChange($event, aspect?.entry?.id)">
|
(change)="onChange($event, aspect?.entry?.id)">
|
||||||
</mat-checkbox>
|
|
||||||
<p class="adf-aspect-list-element-title">{{getTitle(aspect)}}</p>
|
<p class="adf-aspect-list-element-title">{{getTitle(aspect)}}</p>
|
||||||
|
</mat-checkbox>
|
||||||
</mat-panel-title>
|
</mat-panel-title>
|
||||||
<mat-panel-description [id]="'aspect-list-'+colIndex+'-title'"
|
<mat-panel-description [id]="'aspect-list-'+colIndex+'-title'"
|
||||||
[matTooltip]="getTitle(aspect)">
|
[matTooltip]="getTitle(aspect)">
|
||||||
|
@ -20,13 +20,14 @@ import { MatDialog } from '@angular/material/dialog';
|
|||||||
import { Observable, Subject } from 'rxjs';
|
import { Observable, Subject } from 'rxjs';
|
||||||
import { AspectListDialogComponentData } from '../aspect-list-dialog-data.interface';
|
import { AspectListDialogComponentData } from '../aspect-list-dialog-data.interface';
|
||||||
import { AspectListDialogComponent } from '../aspect-list-dialog.component';
|
import { AspectListDialogComponent } from '../aspect-list-dialog.component';
|
||||||
|
import { OverlayContainer } from '@angular/cdk/overlay';
|
||||||
|
|
||||||
@Injectable({
|
@Injectable({
|
||||||
providedIn: 'root'
|
providedIn: 'root'
|
||||||
})
|
})
|
||||||
export class DialogAspectListService {
|
export class DialogAspectListService {
|
||||||
|
|
||||||
constructor(private dialog: MatDialog) {
|
constructor(private dialog: MatDialog, private overlayContainer: OverlayContainer) {
|
||||||
}
|
}
|
||||||
|
|
||||||
openAspectListDialog(nodeId?: string): Observable<string[]> {
|
openAspectListDialog(nodeId?: string): Observable<string[]> {
|
||||||
@ -52,11 +53,14 @@ export class DialogAspectListService {
|
|||||||
data,
|
data,
|
||||||
panelClass,
|
panelClass,
|
||||||
width,
|
width,
|
||||||
|
role: 'dialog',
|
||||||
disableClose: true
|
disableClose: true
|
||||||
});
|
});
|
||||||
|
this.overlayContainer.getContainerElement().setAttribute('role', 'main');
|
||||||
}
|
}
|
||||||
|
|
||||||
close() {
|
close() {
|
||||||
this.dialog.closeAll();
|
this.dialog.closeAll();
|
||||||
|
this.overlayContainer.getContainerElement().setAttribute('role', 'region');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user