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

Center align offline/reconnection badge on the logo.

Browse Source 
fixes #302
This commit is contained in:
softsimon 2021-01-25 01:29:58 +07:00
parent e86b7c7258
commit 9d02ab1eb5
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
2 changed files with 11 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/app/components/master-page/master-page.component.html
View File

@ -4,8 +4,10 @@
<a class="navbar-brand" [routerLink]="['/' | relativeUrl]" style="position: relative;"> <a class="navbar-brand" [routerLink]="['/' | relativeUrl]" style="position: relative;">
<ng-container *ngIf="{ val: connectionState$ | async } as connectionState"> <ng-container *ngIf="{ val: connectionState$ | async } as connectionState">
<img src="./resources/mempool-logo.png" height="35" width="140" class="logo" [ngStyle]="{'opacity': connectionState.val === 2 ? 1 : 0.5 }"> <img src="./resources/mempool-logo.png" height="35" width="140" class="logo" [ngStyle]="{'opacity': connectionState.val === 2 ? 1 : 0.5 }">
<div class="badge badge-warning connection-badge" *ngIf="connectionState.val === 0" i18n="master-page.offline">Offline</div> <div class="connection-badge">
<div class="badge badge-warning connection-badge" style="left: 0px;" *ngIf="connectionState.val === 1" i18n="master-page.reconnecting">Reconnecting...</div> <div class="badge badge-warning" *ngIf="connectionState.val === 0" i18n="master-page.offline">Offline</div>
<div class="badge badge-warning" *ngIf="connectionState.val === 1" i18n="master-page.reconnecting">Reconnecting...</div>
</div>
</ng-container> </ng-container>
</a> </a>

9
frontend/src/app/components/master-page/master-page.component.scss
View File

@ -44,10 +44,15 @@ nav {
} }
.connection-badge { .connection-badge {
margin-left: 10px;
position: absolute; position: absolute;
top: 13px; top: 13px;
left: 40px; left: 0px;
width: 140px;
}
.badge {
margin: 0 auto;
display: table;
} }
.mainnet.active { .mainnet.active {