Add enterprise logos to pizza tracker header
This commit is contained in:
parent
c15393981d
commit
9bd741b1d9
@ -1,8 +1,27 @@
|
|||||||
<div class="mobile-wrapper">
|
<div class="mobile-wrapper">
|
||||||
<div class="mobile-container">
|
<div class="mobile-container">
|
||||||
<div class="panel">
|
<div class="panel">
|
||||||
<div class="field nav-header">
|
<div class="nav-header">
|
||||||
<app-svg-images name="officialMempoolSpace" style="width: 144px; height: 36px" width="500" height="126" viewBox="0 0 500 126"></app-svg-images>
|
@if (enterpriseInfo?.header_img) {
|
||||||
|
<a class="d-flex" [routerLink]="['/' | relativeUrl]">
|
||||||
|
<img [src]="enterpriseInfo.img" class="subdomain_logo" [class]="{'rounded': enterpriseInfo.rounded_corner}">
|
||||||
|
<div class="vertical-line"></div>
|
||||||
|
<img *ngIf="enterpriseInfo.header_img" [src]="enterpriseInfo?.header_img" alt="enterpriseInfo.title" height="36px">
|
||||||
|
</a>
|
||||||
|
} @else if (enterpriseInfo?.img || enterpriseInfo?.imageMd5) {
|
||||||
|
<a [routerLink]="['/' | relativeUrl]">
|
||||||
|
<img [src]="enterpriseInfo.img || '/api/v1/services/enterprise/images/' + enterpriseInfo.name + '/logo?imageMd5=' + enterpriseInfo.imageMd5" class="subdomain_logo" [class]="{'rounded': enterpriseInfo.rounded_corner}">
|
||||||
|
</a>
|
||||||
|
<div class="vertical-line"></div>
|
||||||
|
}
|
||||||
|
@if (!enterpriseInfo?.header_img) {
|
||||||
|
<a [routerLink]="['/' | relativeUrl]">
|
||||||
|
<app-svg-images *ngIf="!officialMempoolSpace" name="mempoolSpace" style="width: 144px; height: 36px" viewBox="0 0 500 126" width="500" height="126" class="mempool-logo"></app-svg-images>
|
||||||
|
<app-svg-images *ngIf="officialMempoolSpace" name="officialMempoolSpace" style="width: 144px; height: 36px" width="500" height="126" viewBox="0 0 500 126"></app-svg-images>
|
||||||
|
</a>
|
||||||
|
}
|
||||||
|
|
||||||
|
@if (enterpriseInfo?.header_img || (!enterpriseInfo?.img && !enterpriseInfo?.imageMd5)) {
|
||||||
<div [ngSwitch]="network" class="network-label">
|
<div [ngSwitch]="network" class="network-label">
|
||||||
<span *ngSwitchCase="'signet'" class="network signet"><span class="name">Bitcoin Signet</span><app-svg-images name="signet" width="35" height="35" viewBox="0 0 65 65" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
<span *ngSwitchCase="'signet'" class="network signet"><span class="name">Bitcoin Signet</span><app-svg-images name="signet" width="35" height="35" viewBox="0 0 65 65" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
||||||
<span *ngSwitchCase="'testnet'" class="network testnet"><span class="name">Bitcoin Testnet3</span><app-svg-images name="testnet" width="35" height="35" viewBox="0 0 65 65" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
<span *ngSwitchCase="'testnet'" class="network testnet"><span class="name">Bitcoin Testnet3</span><app-svg-images name="testnet" width="35" height="35" viewBox="0 0 65 65" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
||||||
@ -11,6 +30,7 @@
|
|||||||
<span *ngSwitchCase="'liquidtestnet'" class="network liquidtestnet"><span class="name">Liquid Testnet</span><app-svg-images name="liquidtestnet" width="35" height="35" viewBox="0 0 125 125" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
<span *ngSwitchCase="'liquidtestnet'" class="network liquidtestnet"><span class="name">Liquid Testnet</span><app-svg-images name="liquidtestnet" width="35" height="35" viewBox="0 0 125 125" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
||||||
<span *ngSwitchDefault class="network mainnet"><span class="name">Bitcoin</span><app-svg-images name="bitcoin" width="35" height="35" viewBox="0 0 65 65" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
<span *ngSwitchDefault class="network mainnet"><span class="name">Bitcoin</span><app-svg-images name="bitcoin" width="35" height="35" viewBox="0 0 65 65" style="display: inline-block" class="mainnet ml-2"></app-svg-images></span>
|
||||||
</div>
|
</div>
|
||||||
|
}
|
||||||
</div>
|
</div>
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<div class="label" i18n="shared.transaction">Transaction</div>
|
<div class="label" i18n="shared.transaction">Transaction</div>
|
||||||
|
@ -40,6 +40,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.nav-header {
|
.nav-header {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
padding: 1em;
|
||||||
position: relative;
|
position: relative;
|
||||||
box-shadow: 0 -5px 15px #000;
|
box-shadow: 0 -5px 15px #000;
|
||||||
z-index: 100;
|
z-index: 100;
|
||||||
@ -54,6 +60,36 @@
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.subdomain_logo {
|
||||||
|
height: 35px;
|
||||||
|
overflow: clip;
|
||||||
|
max-width: 140px;
|
||||||
|
margin: auto;
|
||||||
|
align-self: center;
|
||||||
|
.rounded {
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.subdomain_container {
|
||||||
|
max-width: 140px;
|
||||||
|
text-align: center;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vertical-line {
|
||||||
|
border-left: 1px solid #444;
|
||||||
|
height: 30px;
|
||||||
|
margin-left: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-top: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-holder {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.blockchain-wrapper {
|
.blockchain-wrapper {
|
||||||
|
@ -113,6 +113,10 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
scrollIntoAccelPreview = false;
|
scrollIntoAccelPreview = false;
|
||||||
auditEnabled: boolean = this.stateService.env.AUDIT && this.stateService.env.BASE_MODULE === 'mempool' && this.stateService.env.MINING_DASHBOARD === true;
|
auditEnabled: boolean = this.stateService.env.AUDIT && this.stateService.env.BASE_MODULE === 'mempool' && this.stateService.env.MINING_DASHBOARD === true;
|
||||||
|
|
||||||
|
enterpriseInfo: any;
|
||||||
|
enterpriseInfo$: Subscription;
|
||||||
|
officialMempoolSpace = this.stateService.env.OFFICIAL_MEMPOOL_SPACE;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private route: ActivatedRoute,
|
private route: ActivatedRoute,
|
||||||
private electrsApiService: ElectrsApiService,
|
private electrsApiService: ElectrsApiService,
|
||||||
@ -152,6 +156,10 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
|
|
||||||
this.enterpriseService.page();
|
this.enterpriseService.page();
|
||||||
|
|
||||||
|
this.enterpriseInfo$ = this.enterpriseService.info$.subscribe(info => {
|
||||||
|
this.enterpriseInfo = info;
|
||||||
|
});
|
||||||
|
|
||||||
this.websocketService.want(['blocks', 'mempool-blocks']);
|
this.websocketService.want(['blocks', 'mempool-blocks']);
|
||||||
this.stateService.networkChanged$.subscribe(
|
this.stateService.networkChanged$.subscribe(
|
||||||
(network) => {
|
(network) => {
|
||||||
@ -702,6 +710,7 @@ export class TrackerComponent implements OnInit, OnDestroy {
|
|||||||
this.blocksSubscription.unsubscribe();
|
this.blocksSubscription.unsubscribe();
|
||||||
this.miningSubscription?.unsubscribe();
|
this.miningSubscription?.unsubscribe();
|
||||||
this.currencyChangeSubscription?.unsubscribe();
|
this.currencyChangeSubscription?.unsubscribe();
|
||||||
|
this.enterpriseInfo$?.unsubscribe();
|
||||||
this.leaveTransaction();
|
this.leaveTransaction();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user