70 lines
1.7 KiB
HTML
70 lines
1.7 KiB
HTML
<header>
|
|
|
|
<div fxHide.lt-md="true" fxLayout="row" fxLayoutAlign="space-between" fxShow
|
|
id="header-container-desktop">
|
|
|
|
<div class="title" fxFlex="200px">
|
|
<a [routerLink]="">DiscoTrip</a>
|
|
</div>
|
|
<div fxFlex="calc(100% - 200px)" fxLayout="row" fxLayoutAlign="end">
|
|
|
|
<div fxFlex="60px">
|
|
|
|
<button [matMenuTriggerFor]="tripMenu" class="account-button" mat-fab>
|
|
<mat-icon>local_airport</mat-icon>
|
|
</button>
|
|
|
|
<mat-menu #tripMenu="matMenu">
|
|
<button mat-menu-item>My Trips</button>
|
|
<button mat-menu-item>My Schedule</button>
|
|
</mat-menu>
|
|
|
|
</div>
|
|
|
|
<div fxFlex="60px">
|
|
|
|
<button [matMenuTriggerFor]="profileMenu" class="account-button" mat-fab>
|
|
<mat-icon>person</mat-icon>
|
|
</button>
|
|
|
|
<mat-menu #profileMenu="matMenu">
|
|
<button mat-menu-item>Login</button>
|
|
<button mat-menu-item>Create Account</button>
|
|
<button mat-menu-item>Logout</button>
|
|
</mat-menu>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<mat-form-field appearance="fill">
|
|
<mat-label>Fill form field</mat-label>
|
|
<input matInput placeholder="Placeholder">
|
|
<mat-icon matSuffix>search</mat-icon>
|
|
</mat-form-field>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div id="header-container-mobile" fxLayout="row" fxLayoutAlign="space-between" fxShow
|
|
fxHide.gt-sm="true">
|
|
|
|
<button mat-flat-button style="position: absolute;top: 0;left: 0;height: 60px;">
|
|
<mat-icon style="transform: scale(1.3)">menu</mat-icon>
|
|
</button>
|
|
|
|
<div fxFlex="100%">
|
|
|
|
<div class="title" style="width: 200px;margin: 5px auto;">
|
|
<a [routerLink]="">DiscoTrip</a>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</header>
|