tx page: fixed left column with icon and summary
This commit is contained in:
Gustavo Cortez
parent
73965f0afb
commit
0b3ac5804f
|
|
@ -196,25 +196,24 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|||
.block-id {
|
||||
background-color: #373D42;
|
||||
border: 3px solid #FFFFFF;
|
||||
height: 165px;
|
||||
margin: 10px auto;
|
||||
margin: 0 auto;
|
||||
width: 165px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 80px;
|
||||
}
|
||||
|
||||
.block-id h1 {
|
||||
.block-id span {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.block-id h2 {
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.block-id h3 {
|
||||
color: #FFFFFF;
|
||||
font-weight: bold;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.icon-block {
|
||||
|
|
@ -432,12 +431,18 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
|
|||
line-height: 26px;
|
||||
}
|
||||
|
||||
.tx-id {
|
||||
background-color: #373D42;
|
||||
border: 3px solid #FFFFFF;
|
||||
margin: 0 auto;
|
||||
width: 165px;
|
||||
color: #FFFFFF;
|
||||
font-size: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.transaction-vin-vout .ellipsis { margin-bottom: 10px; }
|
||||
.transaction-vin-vout .btc-value { margin-left: 15px; }
|
||||
|
||||
.page-header { margin-top: 0; }
|
||||
|
||||
.block_hash {
|
||||
margin-left: 46px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,10 +5,10 @@
|
|||
<h1 class="text-center">Address</h1>
|
||||
<div class="text-center">
|
||||
<qrcode size="160" data="{{address.addrStr}}"></qrcode>
|
||||
<div class="m10v">
|
||||
<button class="pull-right btn-copy" clip-copy="address.addrStr"></button>
|
||||
<a class="ellipsis" href="/address/{{address.addrStr}}">{{address.addrStr}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="m10v">
|
||||
<button class="pull-right btn-copy" clip-copy="address.addrStr"></button>
|
||||
<a class="ellipsis" href="/address/{{address.addrStr}}">{{address.addrStr}}</a>
|
||||
</div>
|
||||
<div class="m20v">
|
||||
<h4>Summary</h4>
|
||||
|
|
|
|||
|
|
@ -2,15 +2,14 @@
|
|||
<section data-ng-controller="BlocksController" data-ng-init="findOne()">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-gray col-gray-fixed">
|
||||
<h1 class="text-center">Block</h1>
|
||||
<div class="block-id">
|
||||
<div class="icon-block text-center">
|
||||
<span class="glyphicon glyphicon-list-alt"></span>
|
||||
</div>
|
||||
<h1 data-ng-if="block">Block #{{ block.height }}</h1>
|
||||
<span class="glyphicon glyphicon-list-alt"></span>
|
||||
<h2 data-ng-if="block">#{{ block.height }}</h2>
|
||||
</div>
|
||||
<div class="m10v">
|
||||
<button class="pull-right btn-copy" clip-copy="block.hash"></button>
|
||||
<a class="ellipsis block_hash" href="/address/{{block.hash}}">{{block.hash}}</a>
|
||||
<a class="ellipsis" href="/address/{{block.hash}}">{{block.hash}}</a>
|
||||
</div>
|
||||
<div class="m20v" data-ng-show="!tx.isCoinBase">
|
||||
<h4>Hashes</h4>
|
||||
|
|
|
|||
|
|
@ -1,36 +1,43 @@
|
|||
<div data-ng-include src="'/views/includes/connection.html'"></div>
|
||||
<section data-ng-controller="transactionsController" data-ng-init="findThis()">
|
||||
<h1>
|
||||
Transaction
|
||||
<small>View information about a bitcoin transaction</small>
|
||||
</h1>
|
||||
|
||||
<div class="block-tx">
|
||||
<div data-ng-include src="'/views/transaction/tx.html'"></div>
|
||||
</div><!-- END OF BLOCK-TX -->
|
||||
|
||||
<div class="row">
|
||||
<div data-ng-class="{'col-md-6':!tx.isCoinBase}">
|
||||
<h2>Summary</h2>
|
||||
<table class="table" style="table-layout: fixed">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong> Size </strong></td>
|
||||
<td class="text-muted text-right">{{tx.size}} (bytes)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Received Time </strong></td>
|
||||
<td class="text-muted text-right">{{tx.time * 1000|date:'medium'}}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Block </strong>
|
||||
<td class="text-right">
|
||||
<button class="btn-copy pull-right" clip-copy="tx.blockhash"></button>
|
||||
<a href="/block/{{tx.blockhash}}" class=" ellipsis">{{tx.blockhash}}</a>
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-gray col-gray-fixed">
|
||||
<h1 class="text-center">Transaction</h1>
|
||||
<div class="tx-id">
|
||||
<span class="glyphicon glyphicon-retweet"></span>
|
||||
</div>
|
||||
<div class="col-md-6" data-ng-show="!tx.isCoinBase">
|
||||
<div class="m10v">
|
||||
<button class="btn-copy pull-right" clip-copy="tx.txid"></button>
|
||||
<div class="ellipsis">
|
||||
<a class="txid" href="/tx/{{tx.txid}}">{{tx.txid}}</a>
|
||||
</div>
|
||||
</div>
|
||||
<h4>Summary</h4>
|
||||
<table class="table" style="table-layout: fixed">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong> Size </strong></td>
|
||||
<td class="text-muted text-right">{{tx.size}} (bytes)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Received Time </strong></td>
|
||||
<td class="text-muted text-right">{{tx.time * 1000|date:'medium'}}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-md-9 col-md-offset-3">
|
||||
<h2>
|
||||
Details
|
||||
<small>View information about a bitcoin transaction</small>
|
||||
</h2>
|
||||
|
||||
<div class="block-tx">
|
||||
<div data-ng-include src="'/views/transaction/tx.html'"></div>
|
||||
</div>
|
||||
|
||||
<div data-ng-show="!tx.isCoinBase">
|
||||
<h2>Inputs and Outputs</h2>
|
||||
<table class="table">
|
||||
<tbody>
|
||||
|
|
@ -49,7 +56,6 @@
|
|||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue