Implemented icon for copy to clipboard in join, address book, transactions and addresses.

This commit is contained in:
Gustavo Maximiliano Cortez 2014-07-31 16:40:26 -03:00
commit 87f196ebf4
6 changed files with 68 additions and 34 deletions

View file

@ -1026,4 +1026,28 @@ a.text-white:hover {color: #ccc;}
text-align: left;
}
/**** Copy to clipboard ****/
.btn-copy {
color: #9b9b9b;
display: inline-block;
height: 16px;
width: 16px;
outline: none;
vertical-align: sub;
background: transparent url('../img/icons/copy.png') center center no-repeat;
}
.btn-copied {
display: inline-block;
width: auto;
color: #16A085;
font-weight: bold;
font-size: 11px;
}
.btn-copy.zeroclipboard-is-hover { color: #000; }
.btn-copy.zeroclipboard-is-active { opacity: 1; }
/*-----------------------------------------------------------------*/

View file

@ -115,5 +115,10 @@
float: none;
margin: 0 auto;
}
.btn-copy {
display: none;
}
}

View file

@ -11,7 +11,10 @@
<h3>Share this secret with your other copayers</h3>
<div class="panel">
<qrcode size="250" data="{{$root.wallet.getSecret()}}"></qrcode>
<div class="secret text-gray size-14">{{$root.wallet.getSecret()}}</div>
<div class="secret text-gray size-14">
{{$root.wallet.getSecret()}}
<span class="btn-copy" clip-copy="$root.wallet.getSecret()"></span>
</div>
<div style="clear:both;"></div>
</div>
</div>

View file

@ -1,6 +1,7 @@
<div class="text-center">
<qrcode size="160" data="{{address.address}}"></qrcode>
<h4>{{address.address}}</h4>
<h4>{{address.address}} <span class="btn-copy" clip-copy="address.address"></span></h4>
<div>
<span ng-if="$root.updatingBalance">
<i class="fi-bitcoin-circle icon-rotate spinner"></i>

View file

@ -123,34 +123,34 @@
</div>
</div>
<div class="large-12 columns line-dashed">
<h2>Address Book</h2>
<p class="text-gray" ng-hide="showAddressBook()">Empty. Create an alias for your addresses</p>
<table ng-show="showAddressBook()">
<thead>
<tr>
<th>Label</th>
<th>Address</th>
<th>Creator</th>
<th>Date</th>
<th>&nbsp;</th>
</tr>
</thead>
<tbody>
<tr
ng-repeat="(addr, info) in $root.wallet.addressBook"
ng-class="{'addressbook-disabled': info.hidden}">
<td><a ng-click="copyAddress(addr)" title="Copy address">{{info.label}}</a></td>
<td width="100" class="ellipsis">{{addr}}</td>
<td>{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td>
<td><time>{{info.createdTs | amCalendar}}</time></td>
<td><a ng-click="toggleAddressBookEntry(addr)">{{info.hidden ?
'Enable' : 'Disable'}}</a></td>
<div class="large-12 columns line-dashed">
<h2>Address Book</h2>
<p class="text-gray" ng-hide="showAddressBook()">Empty. Create an alias for your addresses</p>
<table class="large-12 medium-12 small-12" ng-show="showAddressBook()">
<thead>
<tr>
<th>Label</th>
<th>Address</th>
<th>Creator</th>
<th>Date</th>
<th>&nbsp;</th>
</tr>
</tbody>
</table>
<button class="button tiny primary text-center" ng-click="openAddressBookModal()">Add New Entry</button>
</div>
</thead>
<tbody>
<tr
ng-repeat="(addr, info) in $root.wallet.addressBook"
ng-class="{'addressbook-disabled': info.hidden}">
<td><a ng-click="copyAddress(addr)" title="Copy address">{{info.label}}</a></td>
<td class="ellipsis">{{addr}} <span class="btn-copy" clip-copy="addr"></span></td>
<td>{{$root.wallet.publicKeyRing.nicknameForCopayer(info.copayerId)}}</td>
<td><time>{{info.createdTs | amCalendar}}</time></td>
<td width="5"><a ng-click="toggleAddressBookEntry(addr)">{{info.hidden ?
'Enable' : 'Disable'}}</a></td>
</tr>
</tbody>
</table>
<button class="button tiny primary text-center" ng-click="openAddressBookModal()">Add New Entry</button>
</div>
</div>
</div>

View file

@ -123,12 +123,13 @@
</div>
<div class="last-transactions" ng-repeat="btx in blockchain_txs | orderBy: 'time':true">
<div class="last-transactions-header">
<div class="large-8 columns">
<a class="ellipsis" href="http://{{getShortNetworkName()}}.insight.is/tx/{{btx.txid}}" target="_blank">
{{btx.txid}}
</a>
<div class="large-8 medium-7 small-3 columns ellipsis">
<a href="http://{{getShortNetworkName()}}.insight.is/tx/{{btx.txid}}" target="_blank">
{{btx.txid}}
</a>
<span class="btn-copy" clip-copy="btx.txid"></span>
</div>
<div class="large-4 columns text-right">
<div class="large-4 medium-5 small-9 columns text-right">
<div data-ng-show="btx.firstSeenTs">
first seen at
<time>{{btx.firstSeenTs * 1000 | amCalendar}}</time>