mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-04-15 12:55:14 +00:00
+ AoT compatibility + Route animation options + Locked Angular version to 4.3.5 due to broken Angular Animation
70 lines
2.3 KiB
HTML
70 lines
2.3 KiB
HTML
<div id="contacts" class="page-layout simple left-sidenav inner-sidenav" perfect-scrollbar>
|
|
|
|
<!-- HEADER -->
|
|
<div class="header md-accent-bg p-24" fxLayout="column" fxLayoutAlign="start start"
|
|
fxLayout.gt-xs="row" fxLayoutAlign.gt-xs="space-between center">
|
|
|
|
<!-- APP TITLE -->
|
|
<div fxLayout="row" fxLayoutAlign="start center">
|
|
|
|
<button md-button class="mat-icon-button sidenav-toggle mr-12"
|
|
fuseMdSidenavToggler="contacts-main-sidenav"
|
|
fxHide.gt-md>
|
|
<md-icon>menu</md-icon>
|
|
</button>
|
|
|
|
<div class="logo" fxLayout="row" fxLayoutAlign="start center">
|
|
<md-icon class="logo-icon mr-16">account_box</md-icon>
|
|
<span class="logo-text h1">Contacts</span>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- / APP TITLE -->
|
|
|
|
<!-- SEARCH -->
|
|
<div class="search-input-wrapper mt-16 ml-8 m-sm-0" fxLayout="row" fxLayoutAlign="start center">
|
|
<label for="search" class="mr-8">
|
|
<md-icon>search</md-icon>
|
|
</label>
|
|
<md-input-container md-no-float class="m-0" floatPlaceholder="never">
|
|
<input mdInput [formControl]="searchInput" id="search" placeholder="Search for anything">
|
|
</md-input-container>
|
|
</div>
|
|
<!-- / SEARCH -->
|
|
|
|
</div>
|
|
<!-- / HEADER -->
|
|
|
|
<!-- SELECTED BAR -->
|
|
<fuse-selected-bar class="md-accent-600-bg" *ngIf="hasSelectedContacts" [@slideInTop]></fuse-selected-bar>
|
|
<!-- / SELECTED BAR -->
|
|
|
|
<md-sidenav-container>
|
|
|
|
<!-- SIDENAV -->
|
|
<md-sidenav class="sidenav mat-sidenav-opened" align="start" opened="true" mode="side"
|
|
fuseMdSidenavHelper="contacts-main-sidenav" md-is-locked-open="gt-md">
|
|
|
|
<fuse-contacts-main-sidenav></fuse-contacts-main-sidenav>
|
|
|
|
</md-sidenav>
|
|
<!-- / SIDENAV -->
|
|
|
|
<!-- CENTER -->
|
|
<div class="center p-24 pr-sm-92" perfect-scrollbar>
|
|
|
|
<!-- CONTENT -->
|
|
<div class="content md-white-bg mat-elevation-z4">
|
|
|
|
<fuse-contacts-contact-list></fuse-contacts-contact-list>
|
|
|
|
</div>
|
|
<!-- / CONTENT -->
|
|
|
|
</div>
|
|
<!-- / CENTER -->
|
|
|
|
</md-sidenav-container>
|
|
|
|
</div>
|