Skip to content

B
Breeze
Commit eeed9db1 authored by dev0tion's avatar dev0tion
Browse files
Options

Merge branch 'design' of http://www.github.com/stratisproject/breeze into design

parents 5e0431fa 336f4ba1
Show whitespace changes
Inline Side-by-side
Showing with 51 additions and 36 deletions
Breeze.UI/src/app/wallet/dashboard/dashboard.component.html
View file @ eeed9db1
......@@ -4,14 +4,11 @@
<!-- JUMBOTRON-->
<div class="jumbotron jumbotron-fluid">
<div class="container">
<div class="row d-flex align-items-center">
<div class="col-xs-12 col-md-3 text-left">
<h5>Active Wallet</h5>
<p class="lead">
<span class="walletName text-capitalize">{{ walletName }}</span>
</p>
<div class="col-xs-12 text-left">
<h5 class="text-capitalize walletName">{{ walletName }}</h5>
</div>
<div class="col-xs-12 col-md-3 text-left">
<div class="row d-flex align-items-center">
<div class="col-md-4 text-left">
<h5>Active balance</h5>
<p class="lead">
<!--<strong><span class="h2">29</span>.76500293</strong>-->
......@@ -28,7 +25,7 @@
<small class="text-uppercase">usd</small>
</p>
</div>-->
<div class="col-xs-12 col-md-3 text-left">
<div class="col-md-4 text-left">
<h5>Unconfirmed balance</h5>
<p class="lead">
<strong>{{ (unconfirmedBalance | coinNotation) || (0 | coinNotation) }}</strong>
......@@ -36,7 +33,7 @@
</p>
</div>
<!-- /col-->
<div class="col-xs-12 col-md-3 text-right">
<div class="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>
......@@ -58,16 +55,18 @@
<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.transactionType }}</li>
<li class="list-inline-item col-4 amount text-left align-baseline">
<li class="list-inline-item hidden-xs-down col-2 text-uppercase align-bottom">{{ transaction.transactionType }}</li>
<li class="list-inline-item col-3 amount text-left align-baseline">
<span *ngIf="transaction.transactionType == 'received'" class="text-success">+</span>
<span *ngIf="transaction.transactionType == 'sent'" class="text-danger">-</span>
{{ transaction.transactionAmount + transaction.transactionFee | coinNotation }}
<small class="text-uppercase">{{ coinUnit }}</small>
</li>
<li class="list-inline-item col amount text-left align-baseline">
<span *ngIf="transaction.transactionConfirmedInBlock" class="badge badge-success text-capitalize">Confirmed</span>
<span *ngIf="!transaction.transactionConfirmedInBlock" class="badge badge-warning text-capitalize">Pending</span>
</li>
<li class="list-inline-item col text-right align-baseline transactionDate">{{ transaction.transactionTimestamp * 1000 | date:'medium' }}</li>
<li class="list-inline-item col-3 text-right align-baseline transactionDate">{{ transaction.transactionTimestamp * 1000 | date:'medium' }}</li>
</ul>
</div>
</div>
......
Breeze.UI/src/app/wallet/transaction-details/transaction-details.component.html
View file @ eeed9db1
......@@ -8,28 +8,28 @@
<h5 class="modal-title text-uppercase" id="modalDetail">Transaction Details</h5>
<ul class="list-inline row">
<li class="list-inline-item col blockLabel">Type</li>
<li class="list-inline-item col-9 blockText text-capitalize">{{ transaction.transactionType }}</li>
<li class="list-inline-item col-8 blockText text-capitalize">{{ transaction.transactionType }}</li>
</ul>
<ul class="list-inline row">
<li class="list-inline-item col blockLabel">Amount</li>
<li *ngIf="transaction.transactionType == 'received'" class="list-inline-item col-9 blockText text-success">{{ transaction.transactionAmount | coinNotation }} {{ coinUnit }}</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-9 blockText text-danger">-{{ transaction.transactionAmount + transaction.transactionFee | coinNotation }} {{ coinUnit }}</li>
<li *ngIf="transaction.transactionType == 'received'" class="list-inline-item col-8 blockText text-success">{{ transaction.transactionAmount | coinNotation }} {{ coinUnit }}</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-8 blockText text-danger">-{{ transaction.transactionAmount + transaction.transactionFee | coinNotation }} {{ coinUnit }}</li>
</ul>
<!-- <ul class="list-inline row" *ngIf="transaction.transactionType == 'sent'">
<li class="list-inline-item col blockLabel">Fee</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-9 blockText text-danger">{{ transaction.transactionFee | coinNotation }} {{ coinUnit }}</li>
<li *ngIf="transaction.transactionType == 'sent'" class="list-inline-item col-8 blockText text-danger">{{ transaction.transactionFee | coinNotation }} {{ coinUnit }}</li>
</ul> -->
<ul class="list-inline row">
<li class="list-inline-item col blockLabel">Date</li>
<li class="list-inline-item col-9 blockText">{{ transaction.transactionTimestamp * 1000 | date:'medium' }}</li>
<li class="list-inline-item col-8 blockText">{{ transaction.transactionTimestamp * 1000 | date:'medium' }}</li>
</ul>
<ul *ngIf="transaction.transactionConfirmedInBlock" class="list-inline row">
<li class="list-inline-item col blockLabel">Block</li>
<li class="list-inline-item col-9 blockText">#{{ transaction.transactionConfirmedInBlock }}</li>
<li class="list-inline-item col-8 blockText">#{{ transaction.transactionConfirmedInBlock }}</li>
</ul>
<ul class="list-inline row">
<li class="list-inline-item col blockLabel">Confirmations</li>
<li class="list-inline-item col-9 blockText">{{ confirmations }}</li>
<li class="list-inline-item col-8 blockText">{{ confirmations }}</li>
</ul>
<ul class="list-inline row">
<li class="list-inline-item col blockLabel mb-3">Transaction ID</li>
......
Breeze.UI/src/scss/_custom.scss
View file @ eeed9db1
......@@ -15,8 +15,8 @@ a, button {
}
button {
&:disabled {
background: #EFEFEF !important;
border-color: #EFEFEF !important;
background: lighten($gray,20%) !important;
border-color: lighten($gray,20%) !important;
&:hover {cursor: not-allowed !important;}
}
}
......@@ -136,6 +136,14 @@ em {
h5 {
font-size: .85em;
color: $gray-dark;
margin-bottom: 0;
&.walletName {
color: $black;
font-size: 1em;
font-weight: bolder;
margin-bottom: 1.5em;
}
}
p {margin-bottom: 0 !important;}
.lead {
......@@ -144,10 +152,6 @@ em {
font-weight: 500;
margin-bottom: 0;
.walletName {
font-size: 0.7em;
font-weight: normal;
}
.h2 {
font-size: 2em;
font-weight: 600;
......@@ -267,6 +271,9 @@ em {
font-style: italic;
}
.btn-link {padding: 0 !important;}
.btn-primary {
&:disabled {opacity: 1 !important;}
}
}
#modalReceive {
.modal-body {padding: 0 3em;}
......@@ -277,6 +284,7 @@ em {
color: $blue;
text-transform: uppercase;
font-size: .825em;
line-height: 2em;
}
.blockText {
color: $darkgray;
......
Breeze.UI/src/scss/_jumbotron.scss
View file @ eeed9db1
......@@ -5,7 +5,7 @@
@include border-radius($border-radius-lg);
@include media-breakpoint-up(sm) {
padding: ($jumbotron-padding * 2) $jumbotron-padding;
padding: $jumbotron-padding $jumbotron-padding;
}
}
......
Breeze.UI/src/styles.css
View file @ eeed9db1
......@@ -17,8 +17,8 @@ a:hover, button:hover {
}
button:disabled {
background: #EFEFEF !important;
border-color: #EFEFEF !important;
background: #d3d7de !important;
border-color: #d3d7de !important;
}
button:disabled:hover {
......@@ -161,6 +161,14 @@ em.display-4 {
.jumbotron h5 {
font-size: .85em;
color: #878685;
margin-bottom: 0;
}
.jumbotron h5.walletName {
color: #444;
font-size: 1em;
font-weight: bolder;
margin-bottom: 1.5em;
}
.jumbotron p {
......@@ -174,11 +182,6 @@ em.display-4 {
margin-bottom: 0;
}
.jumbotron .lead .walletName {
font-size: 0.7em;
font-weight: normal;
}
.jumbotron .lead .h2 {
font-size: 2em;
font-weight: 600;
......@@ -322,6 +325,10 @@ em.display-4 {
padding: 0 !important;
}
#modalSend .btn-primary:disabled {
opacity: 1 !important;
}
#modalReceive .modal-body {
padding: 0 3em;
}
......@@ -334,6 +341,7 @@ em.display-4 {
color: #7385A0;
text-transform: uppercase;
font-size: .825em;
line-height: 2em;
}
#modalDetail .blockText, #modalCheck .blockText, #modalSettings .blockText {
......@@ -3794,7 +3802,7 @@ tbody.collapse.show {
background-color: #fff;
background-clip: padding-box;
border: 1px solid rgba(68, 68, 68, 0.15);
border-radius: 0.25rem;
border-radius: 50px;
}
.dropdown-divider {
......@@ -5315,7 +5323,7 @@ a.badge:focus, a.badge:hover {
@media (min-width: 576px) {
.jumbotron {
padding: 3.5rem 1.75rem;
padding: 1.75rem 1.75rem;
}
}
......
Breeze.UI/src/styles.css.map
View file @ eeed9db1
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment