<section id="breeze"> <!-- CONTENT --> <section id="content" class="bitcoin"> <!-- JUMBOTRON--> <div class="jumbotron jumbotron-fluid"> <div class="container"> <div class="row d-flex align-items-center"> <div class="col-xs-12 col-md-4 text-left"> <h5>Active balance</h5> <p class="lead"> <!--<strong><span class="h2">29</span>.76500293</strong>--> <strong>{{confirmedBalance | coinNotation }}</strong> <!--<small class="text-uppercase">btc</small>--> </p> </div> <!-- /col--> <!--<div class="col-xs-12 col-md-4 text-left"> <h5>Current value</h5> <p class="lead"> <i class="icon-coin-dollar"></i> <strong><span class="h2">51,390</span></strong> <small class="text-uppercase">usd</small> </p> </div>--> <div class="col-xs-12 col-md-4 text-left"> <h5>Unconfirmed balance</h5> <p class="lead"> <strong>{{unconfirmedBalance | coinNotation }}</strong> </p> </div> <!-- /col--> <div class="col-xs-12 col-md-4 text-right"> <p> <a class="btn btn-secondary" data-toggle="modal" data-target="#modalReceive" role="button" (click)="openReceiveDialog()">Receive</a> <a class="btn btn-primary ml-2" data-toggle="modal" data-target="#modalSend" role="button" (click)="openSendDialog()">Send</a> </p> </div> <!-- /col--> </div> <!-- /row--> </div> <!-- /container--> </div> <!-- /JUMBOTRON--> <!-- TRANSACTIONS --> <section id="transaction" class="container"> <h5>Latest Transactions</h5> <div *ngIf="transactions; else noTransactions"> <div *ngFor="let transaction of transactions; let i=index"> <div class="card" *ngIf="i<3" (click)="openTransactionDetailDialog(transaction)"> <div class="card-block text-nowrap"> <ul class="list-inline row"> <li class="list-inline-item hidden-xs-down col-3 text-uppercase align-bottom">{{ transaction.type }}</li> <li class="list-inline-item col-4 amount text-left align-baseline"><!--<span class="text-success">+</span>--> {{ transaction.amount | coinNotation }} <!--<small class="text-uppercase">btc</small> <span class="badge badge-danger text-capitalize">unconfirmed</span>--></li> <li class="list-inline-item col text-right align-baseline transactionDate">{{ transaction.timestamp * 1000 | date:'medium' }}</li> </ul> </div> </div> <!-- /card--> </div> </div> <ng-template #noTransactions><em class="muted">Looks like you haven't made any transactions yet.</em></ng-template> </section> <!-- /TRANSACTIONS --> <status-bar></status-bar> </section> <!-- /CONTENT--> </section> <!-- /breeze-->