mirror of https://github.com/BTCPrivate/copay.git
add style
This commit is contained in:
Javier
parent
b676c5e37e
commit
fc73d4ff36
|
|
@ -0,0 +1,68 @@
|
|||
#addresses {
|
||||
.addr {
|
||||
&-explanation, &-button-group {
|
||||
padding: 0 1rem;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
&-heading {
|
||||
font-size: 17px;
|
||||
color: $dark-gray;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
&-description {
|
||||
text-align: center;
|
||||
font-size: 15px;
|
||||
color: $mid-gray;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
&-description-disabled {
|
||||
color: cadetblue;
|
||||
text-decoration: none;
|
||||
}
|
||||
&-balance {
|
||||
margin-top: 4px;
|
||||
color: #5DD263;
|
||||
}
|
||||
&-path {
|
||||
margin-top: 4px;
|
||||
color: #B8B8B8;
|
||||
}
|
||||
.addr-title, .addr-value {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.addr-list {
|
||||
.item {
|
||||
color: $dark-gray;
|
||||
padding-top: 1.3rem;
|
||||
padding-bottom: 1.3rem;
|
||||
|
||||
&.has-addr-value {
|
||||
padding-top: .65rem;
|
||||
padding-bottom: .65rem;
|
||||
}
|
||||
|
||||
&.item-divider {
|
||||
color: $mid-gray;
|
||||
padding-bottom: .5rem;
|
||||
font-size: .9rem;
|
||||
}
|
||||
|
||||
.icon {
|
||||
color: $light-gray;
|
||||
}
|
||||
}
|
||||
|
||||
.item-note {
|
||||
color: $light-gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -15,6 +15,7 @@
|
|||
@import "bitpayCardIntro";
|
||||
@import "bitpayCardPreferences";
|
||||
@import "address-book";
|
||||
@import "addresses";
|
||||
@import "wallet-backup-phrase";
|
||||
@import "zero-state";
|
||||
@import "onboarding/onboarding";
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<ion-view hide-tabs>
|
||||
<ion-view hide-tabs id="addresses" class="addr">
|
||||
<ion-nav-bar class="bar-royal">
|
||||
<ion-nav-title>{{'Wallet Addresses' | translate}}</ion-nav-title>
|
||||
<ion-nav-back-button>
|
||||
|
|
@ -6,44 +6,50 @@
|
|||
</ion-nav-bar>
|
||||
|
||||
<ion-content>
|
||||
<div class="text-center padding">
|
||||
<i class="icon ion-ios-ionic-outline"></i>
|
||||
</div>
|
||||
|
||||
<div class="text-center">
|
||||
<span translate>Each bitcoin wallet can generate billions of addresses from your 12-word backup. A new address is automatically generated and shown each time your recive a payment.</span><a ng-click="showInformation()" ng-if="!showInfo" translate> Why?</a>
|
||||
</div>
|
||||
|
||||
<div class="text-center" ng-if="showInfo">
|
||||
<span translate>It's a good idea to avoid reusing addresses-this both protects your privacy and keeps your bitcoins secure against hypothetical attacks by quantum computers.</span><a ng-click="showInformation()" translate> Hide</a>
|
||||
</div>
|
||||
|
||||
<div class="list">
|
||||
<div class="item item-divider item-icon-right" ng-click="addNewAddress()" translate>
|
||||
Unused Addresses
|
||||
<i class="icon ion-ios-plus-empty"></i>
|
||||
<div class="addr-list list">
|
||||
<div class="text-center padding size-42">
|
||||
<i class="icon ion-ios-ionic-outline"></i>
|
||||
</div>
|
||||
|
||||
<div ng-if="unusedAddresses[0]">
|
||||
<div class="item" ng-repeat="uAddress in unusedAddresses track by $index">
|
||||
{{uAddress.address}}
|
||||
<span class="item-note">
|
||||
{{uAddress.path}} {{uAddress.createdOn * 1000 | amDateFormat:'MMMM Do YYYY, hh:mm a'}}
|
||||
</span>
|
||||
<div class="addr-explanation">
|
||||
<div class="addr-description">
|
||||
Each bitcoin wallet can generate billions of addresses from your 12-word backup. A new address is automatically generated and shown each time your recive a payment. <a ng-click="showInformation()" ng-if="!showInfo" translate>Why?</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="!unusedAddresses[0]">
|
||||
<span class="item" translate>Not unused addresses available</span>
|
||||
<div class="addr-explanation" ng-if="showInfo">
|
||||
<div class="addr-description">
|
||||
It's a good idea to avoid reusing addresses-this both protects your privacy and keeps your bitcoins secure against hypothetical attacks by quantum computers. <a ng-click="showInformation()" translate>Hide</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="item item-divider" translate>
|
||||
Addresses With Balance
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="item item-divider item-icon-right" ng-click="addNewAddress()" translate>
|
||||
Unused Addresses
|
||||
<i class="icon ion-ios-plus-empty"></i>
|
||||
</div>
|
||||
|
||||
<div class="item" ng-repeat="addr in addresses track by $index">
|
||||
{{addr.address}}
|
||||
<div>{{addr.balanceStr}}</div>
|
||||
<div ng-if="unusedAddresses[0]">
|
||||
<div class="item" ng-repeat="uAddress in unusedAddresses track by $index">
|
||||
{{uAddress.address}}
|
||||
<div class="addr-path">
|
||||
{{uAddress.path}} {{uAddress.createdOn * 1000 | amDateFormat:'MMMM Do YYYY, hh:mm a'}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div ng-if="!unusedAddresses[0]">
|
||||
<span class="item" translate>Not unused addresses available</span>
|
||||
</div>
|
||||
|
||||
<div class="item item-divider" translate>
|
||||
Addresses With Balance
|
||||
</div>
|
||||
|
||||
<div class="item" ng-repeat="addr in addresses track by $index">
|
||||
{{addr.address}}
|
||||
<div class="addr-balance">{{addr.balanceStr}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
|
|
|
|||
Loading…
Reference in New Issue