Suzana Dirla 3d73e94b5d [ADF-4402] Move component related styles from demo-shell to ADF components (#4808)
* [ADF-4402] remove styling of non-existent items

* [ADF-4402] remove not needed style - bcs overwritten by style from core

* [ADF-4559] remove demo-shell only class from core styling

- use class name from core component for styling

* [ADF-4402] remove not used styling code

- .adf-app-layout-toolbar no longer exists, so no need keep its style

* [ADF-4402] move style from demo-shell to core

- same style was needed in ACA, so probably should be best in core ADF

* [ADF-4402] remove not used styling code

* [ADF-4402] move adf-toolbar-title style from demo-shell to core

* [ADF-4402] remove not used styling code

* [ADF-4402] use existing css class

* [ADF-4402] remove style already set from pagination component

* [ADF-4402] remove not used styling code

* [ADF-4402] viewer toolbar width
2019-06-05 16:01:38 +01:00

88 lines
4.0 KiB
HTML

<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="hideSidenav"
[expandedSidenav]="expandedSidenav" (expanded)="setState($event)" [position]="position">
<adf-sidenav-layout-header>
<ng-template let-toggleMenu="toggleMenu">
<adf-layout-header id="adf-header" [title]="title | translate" [redirectUrl]="redirectUrl" [logo]="logo"
[tooltip]="tooltip | translate" [showSidenavToggle]="showMenu" [color]="color" [position]="position"
(clicked)=toggleMenu($event)>
<div class="adf-app-layout-menu-spacer"></div>
<app-search-bar fxFlex="0 1 auto"></app-search-bar>
<div class="adf-header-delimiexpandedSidenavter"></div>
<adf-userinfo [menuPositionX]="'before'" [menuPositionY]="'above'">
</adf-userinfo>
<app-theme-picker></app-theme-picker>
<button data-automation-id="language-menu-button" mat-icon-button [matMenuTriggerFor]="langMenu">
<mat-icon>language</mat-icon>
</button>
<mat-menu #langMenu="matMenu" class="adf-menu">
<adf-language-menu></adf-language-menu>
</mat-menu>
</adf-layout-header>
</ng-template>
</adf-sidenav-layout-header>
<adf-sidenav-layout-navigation>
<ng-template let-isMenuMinimized="isMenuMinimized">
<mat-nav-list class="adf-sidenav-linklist">
<ng-container *ngFor="let link of links">
<ng-container *ngIf="link.children">
<mat-list-item (click)="trigger.openMenu()" [attr.data-automation-id]="link.title | translate" class="adf-sidenav-link">
<mat-icon matListIcon>{{link.icon}}</mat-icon>
<span matLine *ngIf="!isMenuMinimized()">{{link.title | translate }}</span>
<mat-icon class="adf-sidenav-link__expand-button" [matMenuTriggerData]="{links: link.children}"
rippleTrigger mat-icon-button #trigger="matMenuTrigger"
[matMenuTriggerFor]="nestedMenu">arrow_right</mat-icon>
</mat-list-item>
</ng-container>
<ng-container *ngIf="!link.children">
<mat-list-item [routerLink]="link.href"
routerLinkActive="adf-sidenav-link--active" [routerLinkActiveOptions]="{ exact: true }"
[attr.data-automation-id]="link.title | translate" class="adf-sidenav-link">
<mat-icon matListIcon >{{link.icon}}</mat-icon>
<span matLine *ngIf="!isMenuMinimized()">{{link.title | translate }}</span>
</mat-list-item>
</ng-container>
</ng-container>
<mat-list-item adf-logout [enableRedirect]="enableRedirect" redirectUri="/logout" class="adf-sidenav-link">
<mat-icon matListIcon>exit_to_app</mat-icon>
<span matLine *ngIf="!isMenuMinimized()">Logout</span>
</mat-list-item>
</mat-nav-list>
</ng-template>
</adf-sidenav-layout-navigation>
<adf-sidenav-layout-content>
<ng-template>
<router-outlet></router-outlet>
</ng-template>
</adf-sidenav-layout-content>
</adf-sidenav-layout>
<app-log></app-log>
<mat-menu #nestedMenu="matMenu" xPosition="after" class="nestedMenu">
<ng-template matMenuContent let-links="links">
<button mat-menu-item *ngFor="let link of links"
class="adf-sidenav-link"
[attr.data-automation-id]="link.title | translate"
routerLinkActive="adf-sidenav-link--active"
[routerLink]="link.href"
[routerLinkActiveOptions]="{ exact: true }">
<mat-icon matListIcon>{{link.icon}}</mat-icon>
{{ link.title | translate }}
</button>
</ng-template>
</mat-menu>