mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2024-11-20 10:21:52 +01:00
Code Issues Projects Releases Wiki Activity

Liquid dashboard: switch places of top graphs

Browse Source
This commit is contained in:
natsoni 2024-02-13 09:36:22 +01:00
parent 69747a0028
commit 55cd2f5678
No known key found for this signature in database
GPG Key ID: C65917583181743B
6 changed files with 19 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/app/components/lbtc-pegs-graph/lbtc-pegs-graph.component.ts
View File

@ -18,7 +18,7 @@ import { EChartsOption } from '../../graphs/echarts';
})
export class LbtcPegsGraphComponent implements OnInit, OnChanges {
@Input() data: any;
@Input() height: number | string = '270';
@Input() height: number | string = '320';
pegsChartOptions: EChartsOption;
right: number | string = '10';

2
frontend/src/app/components/liquid-reserves-audit/reserves-ratio/reserves-ratio.component.ts
View File

@ -52,7 +52,7 @@ export class ReservesRatioComponent implements OnInit, OnChanges {
type: 'gauge',
startAngle: 180,
endAngle: 0,
center: ['50%', '70%'],
center: ['50%', '75%'],
radius: '100%',
min: 0.999,
max: 1.001,

1
frontend/src/app/components/liquid-reserves-audit/reserves-supply-stats/reserves-supply-stats.component.scss
View File

@ -41,6 +41,7 @@
}
.fee-text{
border-bottom: 1px solid #ffffff1c;
color: #ffffff;
width: fit-content;
margin: auto;
line-height: 1.45;

25
frontend/src/app/dashboard/dashboard.component.html
View File

@ -162,21 +162,20 @@
<div class="col">
<div class="card-liquid card">
<div class="card-body">
<div class="card-title card-title-liquid">
<app-reserves-supply-stats [currentPeg$]="currentPeg$" [currentReserves$]="currentReserves$"></app-reserves-supply-stats>
<app-reserves-ratio [currentPeg]="currentPeg$ | async" [currentReserves]="currentReserves$ | async"></app-reserves-ratio>
</div>
<div class="card-body pl-0" style="padding-top: 10px;">
<app-lbtc-pegs-graph [data]="fullHistory$ | async" [height]="lbtcPegGraphHeight"></app-lbtc-pegs-graph>
</div>
</div>
</div>
<div class="col" style="margin-bottom: 1.47rem">
<div class="card-liquid card">
<div class="card-title card-title-liquid">
<div class="card-body">
<app-reserves-ratio-stats [fullHistory$]="fullHistory$"></app-reserves-ratio-stats>
</div>
<h5 *ngIf="fullHistory$ | async" class="card-title peg-historical-data">Peg Historical Data</h5>
<div class="card-body pl-0" style="padding-top: 10px;">
<app-lbtc-pegs-graph [data]="fullHistory$ | async" [height]="lbtcPegGraphHeight"></app-lbtc-pegs-graph>
<app-reserves-ratio [currentPeg]="currentPeg$ | async" [currentReserves]="currentReserves$ | async"></app-reserves-ratio>
</div>
</div>
</div>
@ -287,20 +286,20 @@
<div class="col">
<div class="card-liquid card">
<div class="card-body">
<div class="card-title card-title-liquid">
<app-reserves-supply-stats></app-reserves-supply-stats>
<app-reserves-ratio></app-reserves-ratio>
</div>
<div class="card-body pl-0" style="padding-top: 10px;">
<app-lbtc-pegs-graph [height]="lbtcPegGraphHeight"></app-lbtc-pegs-graph>
</div>
</div>
</div>
<div class="col" style="margin-bottom: 1.47rem">
<div class="card-liquid card">
<div class="card-title card-title-liquid">
<div class="card-body">
<app-reserves-ratio-stats></app-reserves-ratio-stats>
</div>
<div class="card-body pl-0" style="padding-top: 10px;">
<app-lbtc-pegs-graph></app-lbtc-pegs-graph>
<app-reserves-ratio></app-reserves-ratio>
</div>
</div>
</div>

12
frontend/src/app/dashboard/dashboard.component.scss
View File

@ -429,18 +429,6 @@
padding-top: 20px;
}
.peg-historical-data {
font-size: 18px;
@media (min-width: 768px) {
padding-top: 22px;
}
@media (min-width: 992px) {
padding-top: 27px;
}
}
.in-progress-message {
position: relative;
color: #ffffff91;

8
frontend/src/app/dashboard/dashboard.component.ts
View File

@ -62,7 +62,7 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit {
currencySubscription: Subscription;
currency: string;
incomingGraphHeight: number = 300;
lbtcPegGraphHeight: number = 250;
lbtcPegGraphHeight: number = 320;
private lastPegBlockUpdate: number = 0;
private lastPegAmount: string = '';
private lastReservesBlockUpdate: number = 0;
@ -398,15 +398,15 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit {
if (window.innerWidth >= 992) {
this.incomingGraphHeight = 300;
this.goggleResolution = 82;
this.lbtcPegGraphHeight = 270;
this.lbtcPegGraphHeight = 320;
} else if (window.innerWidth >= 768) {
this.incomingGraphHeight = 215;
this.goggleResolution = 80;
this.lbtcPegGraphHeight = 190;
this.lbtcPegGraphHeight = 230;
} else {
this.incomingGraphHeight = 180;
this.goggleResolution = 86;
this.lbtcPegGraphHeight = 200;
this.lbtcPegGraphHeight = 220;
}
}
}