machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fee box: Mobile view

Browse Source
This commit is contained in:
softsimon 2020-07-29 17:30:30 +07:00
parent 4a1840b995
commit 3d355257b2
3 changed files with 16 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/app/components/fees-box/fees-box.component.html
View File

@ -1,17 +1,17 @@
<table class="table mx-auto text-center" style="width: 500px"> <table class="table mx-auto text-center" style="max-width: 550px">
<tr> <tr>
<td style="border-top: 0px; width: 33%;">1 hour</td> <td class="d-none d-md-table-cell border-top-0">1 hour</td>
<td style="border-top: 0px; width: 33%;">30 minutes</td> <td class="border-top-0">30 minutes</td>
<td style="border-top: 0px; width: 33%;">Next block</td> <td class="border-top-0">Next block</td>
</tr> </tr>
<tr *ngIf="(feeEstimations$ | async) as feeEstimations; else loadingFees"> <tr *ngIf="(feeEstimations$ | async) as feeEstimations; else loadingFees">
<td>{{ feeEstimations.hourFee }} sat/vB (<app-fiat [value]="feeEstimations.hourFee * 250"></app-fiat>)</td> <td class="d-none d-md-table-cell">{{ feeEstimations.hourFee }} sat/vB (<app-fiat [value]="feeEstimations.hourFee * 250"></app-fiat>)</td>
<td>{{ feeEstimations.halfHourFee }} sat/vB (<app-fiat [value]="feeEstimations.halfHourFee * 250"></app-fiat>)</td> <td>{{ feeEstimations.halfHourFee }} sat/vB (<app-fiat [value]="feeEstimations.halfHourFee * 250"></app-fiat>)</td>
<td>{{ feeEstimations.fastestFee }} sat/vB (<app-fiat [value]="feeEstimations.fastestFee * 250"></app-fiat>)</td> <td>{{ feeEstimations.fastestFee }} sat/vB (<app-fiat [value]="feeEstimations.fastestFee * 250"></app-fiat>)</td>
</tr> </tr>
<ng-template #loadingFees> <ng-template #loadingFees>
<tr> <tr>
<td><span class="skeleton-loader"></span></td> <td class="d-none d-md-table-cell"><span class="skeleton-loader"></span></td>
<td><span class="skeleton-loader"></span></td> <td><span class="skeleton-loader"></span></td>
<td><span class="skeleton-loader"></span></td> <td><span class="skeleton-loader"></span></td>
</tr> </tr>

9
frontend/src/app/components/fees-box/fees-box.component.scss
View File

@ -0,0 +1,9 @@
td {
width: 33%;
}
@media (max-width: 767.98px) {
td {
width: 50%;
}
}

2
frontend/src/app/components/latest-blocks/latest-blocks.component.html
View File

@ -1,4 +1,4 @@
<app-fees-box class="d-block mb-4"></app-fees-box> <app-fees-box class="d-block m-2 mb-4"></app-fees-box>
<div class="container-xl"> <div class="container-xl">
<hr> <hr>