mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2025-01-18 05:12:35 +01:00
Code Issues Projects Releases Wiki Activity

Network based blockchain colors.

Browse Source
This commit is contained in:
softsimon 2020-05-10 21:34:25 +07:00
parent 50f98807a3
commit 4d53e897b4
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
4 changed files with 16 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/components/amount/amount.component.html
View File

@ -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> <span>{{ conversions.USD * (satoshis / 100000000) | currency:'USD':'symbol':'1.2-2' }}</span>
</ng-container> </ng-container>
<ng-template #viewFiatVin> <ng-template #viewFiatVin>

1
frontend/src/app/components/amount/amount.component.ts
View File

@ -15,6 +15,7 @@ export class AmountComponent implements OnInit {
@Input() satoshis: number; @Input() satoshis: number;
@Input() digitsInfo = '1.8-8'; @Input() digitsInfo = '1.8-8';
@Input() noFiat = false;
constructor( constructor(
private stateService: StateService, private stateService: StateService,

4
frontend/src/app/components/block/block.component.html
View File

@ -45,12 +45,12 @@
<ng-template [ngIf]="fees !== undefined" [ngIfElse]="loadingFees"> <ng-template [ngIf]="fees !== undefined" [ngIfElse]="loadingFees">
<tr> <tr>
<td>Total fees</td> <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>
<tr> <tr>
<td>Reward + fees:</td> <td>Reward + fees:</td>
<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> </td>
</tr> </tr>
</ng-template> </ng-template>

14
frontend/src/app/components/blockchain-blocks/blockchain-blocks.component.ts
View File

@ -21,6 +21,12 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
transition = '1s'; transition = '1s';
gradientColors = {
'': ['#9339f4', '#105fb0'],
liquid: ['#116761', '#183550'],
testnet: ['#1d486f', '#183550'],
};
constructor( constructor(
private stateService: StateService, private stateService: StateService,
private router: Router, private router: Router,
@ -103,8 +109,12 @@ export class BlockchainBlocksComponent implements OnInit, OnDestroy {
const greenBackgroundHeight = 100 - (block.weight / 4000000) * 100; const greenBackgroundHeight = 100 - (block.weight / 4000000) * 100;
return { return {
left: 155 * this.blocks.indexOf(block) + 'px', left: 155 * this.blocks.indexOf(block) + 'px',
background: `repeating-linear-gradient(#2d3348, #2d3348 ${greenBackgroundHeight}%, background: `repeating-linear-gradient(
#9339f4 ${Math.max(greenBackgroundHeight, 0)}%, #105fb0 100%)`, #2d3348,
#2d3348 ${greenBackgroundHeight}%,
${this.gradientColors[this.network][0]} ${Math.max(greenBackgroundHeight, 0)}%,
${this.gradientColors[this.network][1]} 100%
)`,
}; };
} }