d0zingcat/gocryptotrader
1
0
Fork 0
mirror of https://github.com/d0zingcat/gocryptotrader.git synced 2026-06-08 15:11:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

Expandable tiles for dashboard

Browse Source
This commit is contained in:
GloriousCode
2017-11-29 17:12:19 +11:00
parent ffd6d392fd
commit b35c6b65bc
3 changed files with 108 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
web/src/app/pages/dashboard/dashboard.component.html
View File

@@ -1,60 +1,17 @@
<mat-grid-list cols="3" rowHeight="24rem">
<mat-grid-tile [colspan]="1" [rowspan]="2">
<mat-grid-tile [colspan]="tile.columns" [rowspan]="tile.rows" *ngFor="let tile of dashboard.tiles">
<mat-card class="full-card">
<mat-card-header>
<mat-card-title>Shiba Inu</mat-card-title>
<mat-card-subtitle>Dog Breed</mat-card-subtitle>
<mat-card-title>{{tile.title}}</mat-card-title>
<mat-card-subtitle>{{tile.subTitle}}</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
HI
{{tile.content}}
</mat-card-content>
<mat-card-footer>
<button mat-button>EXPAND</button>
<button *ngIf="!expanded" (click)="expandTile(tile)" mat-button>EXPAND</button>
<button *ngIf="expanded" (click)="resetTiles()" mat-button>RESTORE</button>
</mat-card-footer>
</mat-card>
</mat-grid-tile>
<mat-grid-tile [colspan]="2" [rowspan]="1">
<mat-card class="full-card">
<mat-card-header>
<mat-card-title>Shiba Inu</mat-card-title>
<mat-card-subtitle>Dog Breed</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
HI
</mat-card-content>
<mat-card-footer>
<button mat-button>EXPAND</button>
</mat-card-footer>
</mat-card>
</mat-grid-tile>
<mat-grid-tile [colspan]="1" [rowspan]="1">
<mat-card class="full-card">
<mat-card-header>
<mat-card-title>Shiba Inu</mat-card-title>
<mat-card-subtitle>Dog Breed</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
HI
</mat-card-content>
<mat-card-footer>
<button mat-button>EXPAND</button>
</mat-card-footer>
</mat-card>
</mat-grid-tile>
<mat-grid-tile [colspan]="1" [rowspan]="1">
<mat-card class="full-card">
<mat-card-header>
<mat-card-title>4 Inu</mat-card-title>
<mat-card-subtitle>Dog Breed</mat-card-subtitle>
</mat-card-header>
<mat-card-content>
HI
</mat-card-content>
<mat-card-footer>
<button mat-button>EXPAND</button>
</mat-card-footer>
</mat-card>
</mat-grid-tile>
</mat-grid-list>