Files
LudosData/src/app/game-grid/game-grid.component.html
2018-06-25 22:00:39 -04:00

53 lines
1.5 KiB
HTML

<mat-toolbar color="primary" class="app-toolbar">
<mat-icon >videogame_asset</mat-icon>
<input class="gameSearchInput" (keyup)="onKey($event)" placeholder="Search Games" >
<span class="example-fill-remaining-space"></span>
<button class="mat-button userButton" mat-button >
<img src="https://i.pinimg.com/280x280_RS/88/42/df/8842df04cd938aa654c865742253c276.jpg" >&nbsp;<span *ngIf="isEmptyObject(currentUser)">{{currentUser.username}}</span>
</button>
<button class="menuButton" mat-button routerLink="/view-card">New Game</button>
<mat-menu #settingsMenu="matMenu">
<button mat-menu-item>Settings</button>
<button mat-menu-item>Help</button>
<button mat-menu-item (click)="logOut()">Log out</button>
</mat-menu>
<button class="mat-icon-button" mat-icon-button [matMenuTriggerFor]="settingsMenu">
<mat-icon>menu</mat-icon>
</button>
</mat-toolbar>
<div *ngIf="isEmptyObject(gamesData)">
<div class="flex-container" >
<mat-card class="card" *ngFor="let game of gamesData;">
<img class="card-img-top" src="{{game.Art}}" alt="">
<div class="card-body">
<p class="card-title">{{game.Title}}</p>
<p class="card-text">{{game.System}}</p>
<a class="editCardButton" mat-mini-fab [routerLink]="['/view-card', game.id]" >
<mat-icon>edit</mat-icon>
</a>
</div>
</mat-card>
</div>
<mat-paginator
[length]="length"
[pageSize]="pageSize"
[pageSizeOptions]="pageSizeOptions"
(page)="pageEvent = paginatorChange($event)">
</mat-paginator>
</div>