Look and feel improvements for wide screens
This commit is contained in:
parent
aaed144151
commit
8a165eefb6
4 changed files with 29 additions and 23 deletions
|
@ -1,6 +1,7 @@
|
|||
<main>
|
||||
<router-outlet></router-outlet>
|
||||
</main>
|
||||
<mat-divider></mat-divider>
|
||||
<div class="footer" align="center">
|
||||
<p>© 2022 Vergara Technologies LLC</p>
|
||||
<p class="tiny">Price data provided by CoinGecko API</p>
|
||||
|
|
|
@ -27,3 +27,6 @@ img.icon{
|
|||
img.total{
|
||||
margin-bottom:-2px;
|
||||
}
|
||||
.central{
|
||||
max-width: 450px;
|
||||
}
|
||||
|
|
|
@ -7,39 +7,41 @@
|
|||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<div align="center">
|
||||
<div class="central">
|
||||
<table class="text" width="75%">
|
||||
<tr>
|
||||
<td width="50%" align="center">
|
||||
<h3>Today's Total:</h3>
|
||||
<p class="total"><img class="total" src="/assets/zec-roboto.png" height="18px" />{{todayTotal | number: '1.0-6'}}</p>
|
||||
<p class="total"><img class="total" src="/assets/spartan-zec.png" height="18px" />{{todayTotal | number: '1.0-6'}}</p>
|
||||
</td>
|
||||
<td width="50%" align="center">
|
||||
<h3>Overall Total:</h3>
|
||||
<p class="total"><img class="total" src="/assets/zec-roboto.png" height="18px" />{{total | number: '1.0-6'}}</p>
|
||||
<p class="total"><img class="total" src="/assets/spartan-zec.png" height="18px" />{{total | number: '1.0-6'}}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<mat-accordion *ngIf = "orders.length > 0">
|
||||
<mat-expansion-panel class="text" *ngFor = "let order of orders">
|
||||
<mat-expansion-panel-header class="text" >
|
||||
<mat-panel-title>
|
||||
<span class="price number"><img src="/assets/zec-roboto.png" height="50%" />{{order.totalZec}}</span>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
{{order.timestamp | date: 'short'}}
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<p class="text">Order: {{order._id}}</p>
|
||||
<p class="text">Zcash price: {{order.price | currency: order.currency.toUpperCase()}}</p>
|
||||
<mat-list>
|
||||
<mat-list-item class="text small" *ngFor="let item of order.lines">{{item.qty}} x {{item.name}}</mat-list-item>
|
||||
</mat-list>
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
||||
<p class="text" *ngIf = "orders.length <= 0">No orders</p>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
<div align="center">
|
||||
<p class="text"> <mat-icon class="icon" inline>copyright</mat-icon> 2021 ZGo </p>
|
||||
<div class="central">
|
||||
<mat-accordion *ngIf = "orders.length > 0">
|
||||
<mat-expansion-panel class="text" *ngFor = "let order of orders">
|
||||
<mat-expansion-panel-header class="text" >
|
||||
<mat-panel-title>
|
||||
<span class="price number"><img src="/assets/spartan-zec.png" height="50%" />{{order.totalZec}}</span>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
{{order.timestamp | date: 'short'}}
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<p class="text">Order: {{order._id}}</p>
|
||||
<p class="text">Zcash price: {{order.price | currency: order.currency.toUpperCase()}}</p>
|
||||
<mat-list>
|
||||
<mat-list-item class="text small" *ngFor="let item of order.lines">{{item.qty}} x {{item.name}}</mat-list-item>
|
||||
</mat-list>
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
||||
<p class="text" *ngIf = "orders.length <= 0">No orders</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<td>Order Total:</td>
|
||||
<td align="right">
|
||||
<p class="number">{{total | currency: getCurrency()}}</p>
|
||||
<p class="number"><img class="icon" src="/assets/zec-roboto.png" width="14px" />{{(total/price) | number: '1.0-6'}}</p>
|
||||
<p class="number"><img class="icon" src="/assets/spartan-zec.png" width="15px" />{{(total/price) | number: '1.0-6'}}</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
|
Loading…
Reference in a new issue