tfabrica/ClientApp/app/components/main/tfabrica.sidenav.component.html

library for TFabrica - TechSol

<style>
    .sidenav-content {
        width: 300px;
    }
</style>
<div class="sidenav-content" style="z-index: 100;">
    <md-toolbar color="primary" >
        
        <button (click)="backToHome()"
                md-icon-button
                class="md-icon-button"
                aria-label="Settings">
            <md-icon>home</md-icon>
        </button>
        {{title}}
        <span fxFlex>
        </span>
        <img src="images/ts_logo_stroke.png" style="width:46px;" (click)="goToMainApp()" />
    </md-toolbar>

    <md-progress-bar *ngIf="loading == true" mode="indeterminate"></md-progress-bar>

    <div fxLayout="column">

        <md-list>
            <md-list-item *ngFor="let singleVoice of displayVoices" 
                          [ngClass]="singleVoice.levelClass"
                          (click)="selectSingleVoice(singleVoice)"
                          >
                <h4 md-line>{{singleVoice.title | translate}}</h4>
                <p md-line> {{singleVoice.subTitle | translate}} </p>
                <span flex></span>
                
                <md-icon *ngIf="singleVoice['subMenu'].length > 0 && singleVoice.isOpen">keyboard_arrow_up</md-icon>
                <md-icon *ngIf="singleVoice['subMenu'].length > 0 && !singleVoice.isOpen">keyboard_arrow_down</md-icon>
                <md-icon *ngIf="singleVoice['subMenu'].length == 0">play_arrow</md-icon>

            </md-list-item>
        </md-list>

    </div>

</div>