Commit 4d67bd4f authored by Benoît's avatar Benoît

fix navbar & modal transaction details

parent d42348f4
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
"cross-env": "5.0.1", "cross-env": "5.0.1",
"css-loader": "^0.28.4", "css-loader": "^0.28.4",
"cssnano": "^3.10.0", "cssnano": "^3.10.0",
"electron": "^1.6.11", "electron": "^1.7.4",
"electron-packager": "^8.7.2", "electron-packager": "^8.7.2",
"electron-reload": "1.2.1", "electron-reload": "1.2.1",
"exports-loader": "^0.6.4", "exports-loader": "^0.6.4",
...@@ -102,12 +102,12 @@ ...@@ -102,12 +102,12 @@
"source-map-loader": "^0.2.1", "source-map-loader": "^0.2.1",
"style-loader": "^0.18.2", "style-loader": "^0.18.2",
"stylus-loader": "^3.0.1", "stylus-loader": "^3.0.1",
"ts-node": "~3.1.0", "ts-node": "~3.2.0",
"tslint": "~5.4.3", "tslint": "~5.5.0",
"typescript": "2.3.4", "typescript": "2.3.4",
"url-loader": "^0.5.9", "url-loader": "^0.5.9",
"webdriver-manager": "12.0.6", "webdriver-manager": "12.0.6",
"webpack": "^3.0.0", "webpack": "^3.1.0",
"webpack-dev-server": "~2.5.0" "webpack-dev-server": "~2.5.1"
} }
} }
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div *ngIf="hasWallet"> <div *ngIf="hasWallet">
<p class="lead">Please choose the wallet you would like to open</p> <p class="lead">Please choose the wallet you would like to open</p>
<div class="row d-flex justify-content-center"> <div class="row d-flex justify-content-center">
<form class="col-md-8 col-xs-12 text-left" [formGroup]="openWalletForm"> <form class="col-md-6 col-xs-12 text-left" [formGroup]="openWalletForm">
<div class="form-group"> <div class="form-group">
<label class="col-12 row" for="Select">Wallet</label> <label class="col-12 row" for="Select">Wallet</label>
<select class="form-control custom-select col-12" formControlName="selectWallet"> <select class="form-control custom-select col-12" formControlName="selectWallet">
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
<p class="lead">Looks like you're new here. <br />Please create or restore a wallet.</p> <p class="lead">Looks like you're new here. <br />Please create or restore a wallet.</p>
</ng-template> </ng-template>
<div class="row d-flex justify-content-center"> <div class="row d-flex justify-content-center">
<button type="button" class="btn btn-darkgray btn-lg" (click)="onCreateClicked()">Create or restore a wallet</button> <button type="button" class="btn btn-linkgray btn-lg" (click)="onCreateClicked()">Create or restore a wallet</button>
</div> </div>
</div> </div>
<!-- /container--> <!-- /container-->
...@@ -40,4 +40,3 @@ ...@@ -40,4 +40,3 @@
<!-- /login--> <!-- /login-->
</section> </section>
<!-- /breeze--> <!-- /breeze-->
...@@ -8,11 +8,11 @@ ...@@ -8,11 +8,11 @@
<h5 class="modal-title text-uppercase" id="modalDetail">Transaction Details</h5> <h5 class="modal-title text-uppercase" id="modalDetail">Transaction Details</h5>
<ul class="list-inline row"> <ul class="list-inline row">
<li class="list-inline-item col blockLabel">Type</li> <li class="list-inline-item col blockLabel">Type</li>
<li class="list-inline-item col-9 blockText">{{ transaction.type }}</li> <li class="list-inline-item col-9 blockText text-capitalize">{{ transaction.type }}</li>
</ul> </ul>
<ul class="list-inline row"> <ul class="list-inline row">
<li class="list-inline-item col blockLabel">Amount</li> <li class="list-inline-item col blockLabel">Amount</li>
<li class="list-inline-item col-9 blockText"><strong class="text-success">{{transaction.amount | coinNotation }}</strong></li> <li class="list-inline-item col-9 blockText text-success">{{transaction.amount | coinNotation }}</li>
</ul> </ul>
<!--<ul class="list-inline row"> <!--<ul class="list-inline row">
<li class="list-inline-item col blockLabel">From</li> <li class="list-inline-item col blockLabel">From</li>
...@@ -20,17 +20,17 @@ ...@@ -20,17 +20,17 @@
</ul>--> </ul>-->
<ul class="list-inline row"> <ul class="list-inline row">
<li class="list-inline-item col blockLabel">Date</li> <li class="list-inline-item col blockLabel">Date</li>
<li class="list-inline-item col-9 blockText"><small>{{ transaction.timestamp * 1000 | date:'medium' }}</small></li> <li class="list-inline-item col-9 blockText">{{ transaction.timestamp * 1000 | date:'medium' }}</li>
</ul> </ul>
<ul class="list-inline row"> <ul class="list-inline row">
<li class="list-inline-item col blockLabel">Block</li> <li class="list-inline-item col blockLabel">Block</li>
<li class="list-inline-item col-9 blockText">#{{ transaction.confirmedInBlock }}</li> <li class="list-inline-item col-9 blockText">#{{ transaction.confirmedInBlock }}</li>
</ul> </ul>
<ul class="list-inline row"> <ul class="list-inline row">
<li class="list-inline-item col blockLabel">Transaction ID</li> <li class="list-inline-item col blockLabel my-3">Transaction ID</li>
<li class="list-inline-item col-9 blockText blockID"><code>{{ transaction.id }}</code></li> <li class="list-inline-item col-10 blockID"><code>{{ transaction.id }}</code></li>
<span class="float-right"><a ngxClipboard [cbContent]="transaction.id" (click)="onCopiedClick()">copy</a></span> <span class="float-right"><a ngxClipboard [cbContent]="transaction.id" (click)="onCopiedClick()">copy</a></span>
<span class="badge badge-success list-inline-item col blockLabel" *ngIf="copied">The transaction ID has been copied to your clipboard.</span> <span class="badge badge-success list-inline-item col" *ngIf="copied">The transaction ID has been copied to your clipboard.</span>
</ul> </ul>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
......
...@@ -34,7 +34,7 @@ code {color: $spacegray !important;} ...@@ -34,7 +34,7 @@ code {color: $spacegray !important;}
#content { #content {
width: 100%; width: 100%;
position: relative; position: relative;
padding: 63px 0 70px 70px; padding: 0 0 70px 70px;
} }
// sidebar // sidebar
...@@ -120,6 +120,7 @@ code {color: $spacegray !important;} ...@@ -120,6 +120,7 @@ code {color: $spacegray !important;}
// transactions // transactions
#transaction { #transaction {
padding-top: 2em;
h5 { h5 {
font-size: .85em; font-size: .85em;
color: $gray-dark; color: $gray-dark;
......
.jumbotron { .jumbotron {
padding: $jumbotron-padding; padding: $jumbotron-padding;
margin-bottom: $jumbotron-padding;
background-color: $jumbotron-bg; background-color: $jumbotron-bg;
border-top: 1px solid $gray-light;
border-bottom: 1px solid $gray-light; border-bottom: 1px solid $gray-light;
@include border-radius($border-radius-lg); @include border-radius($border-radius-lg);
......
...@@ -19,10 +19,11 @@ ...@@ -19,10 +19,11 @@
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: $navbar-padding-y $navbar-padding-x 0 70px; padding: 0 $navbar-padding-x 0 70px;
box-shadow: inset 0 1px 4px 0 rgba(0,0,0,0.08); box-shadow: inset 0 1px 4px 0 rgba(0,0,0,0.08);
background: $white; background: $white;
border-bottom: 1px solid $gray-light; border-bottom: 1px solid $gray-light;
height: auto;
} }
...@@ -62,7 +63,7 @@ ...@@ -62,7 +63,7 @@
font-size: .96rem; font-size: .96rem;
letter-spacing: 0.53px; letter-spacing: 0.53px;
font-weight: 500; font-weight: 500;
padding-bottom: 1.25rem; padding: 1.5rem 0 1.25rem;
} }
} }
......
...@@ -223,7 +223,7 @@ $container-max-widths: ( ...@@ -223,7 +223,7 @@ $container-max-widths: (
sm: 540px, sm: 540px,
md: 720px, md: 720px,
lg: 960px, lg: 960px,
xl: 1140px xl: 1080px
) !default; ) !default;
@include _assert-ascending($container-max-widths, "$container-max-widths"); @include _assert-ascending($container-max-widths, "$container-max-widths");
......
This source diff could not be displayed because it is too large. You can view the blob instead.
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