mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
ef229dd300
* Set aria expanded for the sidenav toggle bar * Define initialSidenavExpanded which can be set in the demo shell than as taken the same true or false value as the sideNav.expandedSidenav value. * Added some unit tests for the sidenav toggle aria-expanded behaviour * Update lib/core/layout/components/header/header.component.ts Co-Authored-By: Denys Vuika <denys.vuika@alfresco.com> * Update lib/core/layout/components/header/header.component.html Co-Authored-By: Denys Vuika <denys.vuika@alfresco.com> * Update demo-shell/src/app/components/app-layout/app-layout.component.html Co-Authored-By: Denys Vuika <denys.vuika@alfresco.com> * Update lib/core/layout/components/header/header.component.html Co-Authored-By: Denys Vuika <denys.vuika@alfresco.com> * As suggested from Denys remove initialSidnavExpanded property as we already have expandedSidenav * As suggested from Denys remove initialSidnavExpanded property as we already have expandedSidenav * As suggested from Denys remove initialSidnavExpanded property as we already have expandedSidenav
56 lines
1.7 KiB
HTML
56 lines
1.7 KiB
HTML
<mat-toolbar
|
|
[color]="color"
|
|
[style.background-color]="color"
|
|
role="heading"
|
|
aria-level="1">
|
|
<button
|
|
*ngIf="showSidenavToggle && position === 'start'"
|
|
id="adf-sidebar-toggle-start"
|
|
data-automation-id="adf-menu-icon"
|
|
class="mat-icon-button adf-menu-icon"
|
|
mat-icon-button
|
|
(click)="toggleMenu()"
|
|
[attr.aria-expanded]="expandedSidenav"
|
|
[attr.aria-label]="'CORE.HEADER.ACCESSIBILITY.SIDEBAR_TOGGLE_BUTTON_ARIA_LABEL' | translate">
|
|
<mat-icon
|
|
class="mat-icon material-icon"
|
|
role="img"
|
|
aria-hidden="true">menu</mat-icon>
|
|
</button>
|
|
|
|
<a [routerLink]="redirectUrl" title="{{ tooltip }}">
|
|
<img
|
|
src="{{ logo }}"
|
|
class="adf-app-logo"
|
|
alt="{{ 'CORE.HEADER.LOGO_ARIA' | translate }}"
|
|
/>
|
|
</a>
|
|
|
|
<span
|
|
role="link"
|
|
[attr.aria-label]="title | translate"
|
|
[routerLink]="redirectUrl"
|
|
fxFlex="1 1 auto"
|
|
fxShow
|
|
fxHide.lt-sm="true"
|
|
class="adf-app-title"
|
|
>{{ title }}</span>
|
|
<ng-content></ng-content>
|
|
|
|
<button
|
|
*ngIf="showSidenavToggle && position === 'end'"
|
|
id="adf-sidebar-toggle-end"
|
|
data-automation-id="adf-menu-icon"
|
|
class="mat-icon-button adf-menu-icon"
|
|
mat-icon-button
|
|
(click)="toggleMenu()"
|
|
[attr.aria-expanded]="expandedSidenav"
|
|
[attr.aria-label]="'CORE.HEADER.ACCESSIBILITY.SIDEBAR_TOGGLE_BUTTON_ARIA_LABEL' | translate">
|
|
>
|
|
<mat-icon
|
|
class="mat-icon material-icon"
|
|
role="img"
|
|
aria-hidden="true">menu</mat-icon>
|
|
</button>
|
|
</mat-toolbar>
|