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

[pizza] fix status icon layout w/ accelerator modal

Browse Source
This commit is contained in:
Mononaut 2024-07-14 04:40:27 +00:00
parent 530610add6
commit 6b955acf9e
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
2 changed files with 72 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/app/components/tracker/tracker.component.html
View File

@ -117,7 +117,8 @@
<div class="spinner-border text-light" style="width: 1em; height: 1em"></div> <div class="spinner-border text-light" style="width: 1em; height: 1em"></div>
</div> </div>
<span class="explainer">&nbsp;</span> <span class="explainer">&nbsp;</span>
} @else if (showAccelerationSummary) { } @else {
@if (!tx.status?.confirmed && showAccelerationSummary) {
<ng-container *ngIf="(ETA$ | async) as eta;"> <ng-container *ngIf="(ETA$ | async) as eta;">
<app-accelerate-checkout <app-accelerate-checkout
*ngIf="(da$ | async) as da;" *ngIf="(da$ | async) as da;"
@ -130,10 +131,11 @@
[eta]="eta" [eta]="eta"
[scrollEvent]="scrollIntoAccelPreview" [scrollEvent]="scrollIntoAccelPreview"
(unavailable)="eligibleForAcceleration = false" (unavailable)="eligibleForAcceleration = false"
class="h-100 w-100" class="w-100"
></app-accelerate-checkout> ></app-accelerate-checkout>
</ng-container> </ng-container>
} @else { }
<div class="status-panel d-flex flex-column h-100 w-100 justify-content-center align-items-center" [class.small-status]="!tx.status?.confirmed && showAccelerationSummary">
@if (tx?.acceleration && !tx.status?.confirmed) { @if (tx?.acceleration && !tx.status?.confirmed) {
<div class="progress-icon"> <div class="progress-icon">
<fa-icon [icon]="['fas', 'wand-magic-sparkles']" [fixedWidth]="true"></fa-icon> <fa-icon [icon]="['fas', 'wand-magic-sparkles']" [fixedWidth]="true"></fa-icon>
@ -179,6 +181,7 @@
} }
} }
} }
</div>
} }
</div> </div>

11
frontend/src/app/components/tracker/tracker.component.scss
View File

@ -166,7 +166,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: start;
.explainer { .explainer {
margin: 0 1em; margin: 0 1em;
@ -178,6 +178,15 @@
font-size: clamp(30px, 20vw, 150px); font-size: clamp(30px, 20vw, 150px);
} }
.status-panel {
&.small-status {
min-height: 180px;
.progress-icon {
font-size: clamp(20px, 13vw, 100px);
}
}
}
.footer-link { .footer-link {
display: flex; display: flex;
flex-direction: row; flex-direction: row;