igniteui-angular-sovn/src/lib/navigation-drawer/navigation-drawer.component.html

Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps

<ng-template #defaultItemsTemplate>
    <div igxDrawerItem [isHeader]="true">Navigation Drawer</div>
    <div igxDrawerItem> Start by adding</div>
    <div igxDrawerItem> <code>&lt;ng-template igxDrawer&gt;</code> </div>
    <div igxDrawerItem> And some items inside </div>
    <div igxDrawerItem> Style with igxDrawerItem </div>
    <div igxDrawerItem> and igxRipple directives</div>
</ng-template>

<div [hidden]="pin"
    class="igx-nav-drawer__overlay"
    [class.igx-nav-drawer__overlay--hidden]="!isOpen"
    [class.igx-nav-drawer--disable-animation]="disableAnimation"
    (click)="close()" #overlay>
</div>
<aside role="navigation"
    class="igx-nav-drawer__aside"
    [class.igx-nav-drawer__aside--collapsed]="!miniTemplate && !isOpen"
    [class.igx-nav-drawer__aside--mini]="miniTemplate && !isOpen"
    [class.igx-nav-drawer__aside--normal]="!miniTemplate || isOpen"
    [class.igx-nav-drawer__aside--pinned]="pin"
    [class.igx-nav-drawer__aside--right]="position === 'right'" #aside
    [class.igx-nav-drawer--disable-animation]="disableAnimation">

    <ng-container *ngTemplateOutlet="template || defaultItemsTemplate"></ng-container>
</aside>
<div class="igx-nav-drawer__style-dummy" #dummy></div>