mirror of
https://github.com/mempool/mempool.git
synced 2025-01-18 05:12:35 +01:00
Network based blockchain colors.
This commit is contained in:
parent
50f98807a3
commit
4d53e897b4
@ -1,4 +1,4 @@
|
||||
<ng-container *ngIf="(viewFiat$ | async) && (conversions$ | async) as conversions; else viewFiatVin">
|
||||
<ng-container *ngIf="!noFiat && (viewFiat$ | async) && (conversions$ | async) as conversions; else viewFiatVin">
|
||||
<span>{{ conversions.USD * (satoshis / 100000000) | currency:'USD':'symbol':'1.2-2' }}</span>
|
||||
</ng-container>
|
||||
<ng-template #viewFiatVin>
|
||||
|
@ -15,6 +15,7 @@ export class AmountComponent implements OnInit {
|
||||
|
||||
@Input() satoshis: number;
|
||||
@Input() digitsInfo = '1.8-8';
|
||||
@Input() noFiat = false;
|
||||
|
||||
constructor(
|
||||
private stateService: StateService,
|
||||
|
@ -45,12 +45,12 @@
|
||||
<ng-template [ngIf]="fees !== undefined" [ngIfElse]="loadingFees">
|
||||
<tr>
|
||||
<td>Total fees</td>
|
||||
<td><app-amount [satoshis]="fees * 100000000" digitsInfo="1.2-2"></app-amount> (<app-fiat [value]="fees * 100000000" digitsInfo="1.0-0"></app-fiat>)</td>
|
||||
<td><app-amount [satoshis]="fees * 100000000" digitsInfo="1.2-2" [noFiat]="true"></app-amount> (<app-fiat [value]="fees * 100000000" digitsInfo="1.0-0"></app-fiat>)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Reward + fees:</td>
|
||||
<td>
|
||||
<app-amount [satoshis]="(blockSubsidy + fees) * 100000000" digitsInfo="1.2-2"></app-amount> (<app-fiat [value]="(blockSubsidy + fees) * 100000000" digitsInfo="1.0-0"></app-fiat>)
|
||||
<app-amount [satoshis]="(blockSubsidy + fees) * 100000000" digitsInfo="1.2-2" [noFiat]="true"></app-amount> (<app-fiat [value]="(blockSubsidy + fees) * 100000000" digitsInfo="1.0-0"></app-fiat>)
|
||||
</td>
|
||||
</tr>
|
||||
</ng-template>
|
||||
|
@ -21,6 +21,12 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
|
||||
|
||||
transition = '1s';
|
||||
|
||||
gradientColors = {
|
||||
'': ['#9339f4', '#105fb0'],
|
||||
liquid: ['#116761', '#183550'],
|
||||
testnet: ['#1d486f', '#183550'],
|
||||
};
|
||||
|
||||
constructor(
|
||||
private stateService: StateService,
|
||||
private router: Router,
|
||||
@ -103,8 +109,12 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
|
||||
const greenBackgroundHeight = 100 - (block.weight / 4000000) * 100;
|
||||
return {
|
||||
left: 155 * this.blocks.indexOf(block) + 'px',
|
||||
background: `repeating-linear-gradient(#2d3348, #2d3348 ${greenBackgroundHeight}%,
|
||||
#9339f4 ${Math.max(greenBackgroundHeight, 0)}%, #105fb0 100%)`,
|
||||
background: `repeating-linear-gradient(
|
||||
#2d3348,
|
||||
#2d3348 ${greenBackgroundHeight}%,
|
||||
${this.gradientColors[this.network][0]} ${Math.max(greenBackgroundHeight, 0)}%,
|
||||
${this.gradientColors[this.network][1]} 100%
|
||||
)`,
|
||||
};
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user