Merge pull request #2475 from mempool/simon/channel-tx-details-button

Channel txs details buttons
This commit is contained in:
wiz 2022-08-31 14:41:25 +02:00 committed by GitHub
commit 799e8d9e23
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 7 deletions

View file

@ -65,14 +65,18 @@
<ng-container *ngIf="transactions$ | async as transactions">
<ng-template [ngIf]="transactions[0]">
<h3>Opening transaction</h3>
<app-transactions-list [transactions]="[transactions[0]]" [showConfirmations]="true" [rowLimit]="5"></app-transactions-list>
<div class="d-flex">
<h3>Opening transaction</h3>
<button type="button" class="btn btn-outline-info details-button btn-sm" (click)="txList1.toggleDetails()" i18n="transaction.details|Transaction Details">Details</button>
</div>
<app-transactions-list #txList1 [transactions]="[transactions[0]]" [showConfirmations]="true" [rowLimit]="5"></app-transactions-list>
</ng-template>
<ng-template [ngIf]="transactions[1]">
<div class="closing-header">
<div class="closing-header d-flex">
<h3 style="margin: 0;">Closing transaction</h3>&nbsp;&nbsp;<app-closing-type [type]="channel.closing_reason"></app-closing-type>
<button type="button" class="btn btn-outline-info details-button btn-sm" (click)="txList2.toggleDetails()" i18n="transaction.details|Transaction Details">Details</button>
</div>
<app-transactions-list [transactions]="[transactions[1]]" [showConfirmations]="true" [rowLimit]="5"></app-transactions-list>
<app-transactions-list #txList2 [transactions]="[transactions[1]]" [showConfirmations]="true" [rowLimit]="5"></app-transactions-list>
</ng-template>
</ng-container>

View file

@ -45,19 +45,29 @@ app-fiat {
}
.closing-header {
display: flex;
flex-direction: row;
margin-bottom: 1rem;
align-items: center;
}
h3 {
margin-bottom: 0rem;
}
@media (max-width: 768px) {
h3 {
font-size: 1.4rem;
white-space: nowrap;
}
.closing-header {
flex-wrap: wrap;
}
app-closing-type {
flex-basis: 100%;
order: 1;
}
}
.loading-spinner {
position: absolute;
top: 400px;
@ -67,4 +77,9 @@ app-fiat {
@media (max-width: 767.98px) {
top: 450px;
}
}
}
.details-button {
align-self: center;
margin-left: auto;
}