mirror of https://github.com/BTCPrivate/copay.git
add style
This commit is contained in:
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 "bitpayCardIntro";
|
||||||
@import "bitpayCardPreferences";
|
@import "bitpayCardPreferences";
|
||||||
@import "address-book";
|
@import "address-book";
|
||||||
|
@import "addresses";
|
||||||
@import "wallet-backup-phrase";
|
@import "wallet-backup-phrase";
|
||||||
@import "zero-state";
|
@import "zero-state";
|
||||||
@import "onboarding/onboarding";
|
@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-bar class="bar-royal">
|
||||||
<ion-nav-title>{{'Wallet Addresses' | translate}}</ion-nav-title>
|
<ion-nav-title>{{'Wallet Addresses' | translate}}</ion-nav-title>
|
||||||
<ion-nav-back-button>
|
<ion-nav-back-button>
|
||||||
|
@ -6,44 +6,50 @@
|
||||||
</ion-nav-bar>
|
</ion-nav-bar>
|
||||||
|
|
||||||
<ion-content>
|
<ion-content>
|
||||||
<div class="text-center padding">
|
<div class="addr-list list">
|
||||||
<i class="icon ion-ios-ionic-outline"></i>
|
<div class="text-center padding size-42">
|
||||||
</div>
|
<i class="icon ion-ios-ionic-outline"></i>
|
||||||
|
|
||||||
<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>
|
</div>
|
||||||
|
|
||||||
<div ng-if="unusedAddresses[0]">
|
<div class="addr-explanation">
|
||||||
<div class="item" ng-repeat="uAddress in unusedAddresses track by $index">
|
<div class="addr-description">
|
||||||
{{uAddress.address}}
|
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>
|
||||||
<span class="item-note">
|
|
||||||
{{uAddress.path}} {{uAddress.createdOn * 1000 | amDateFormat:'MMMM Do YYYY, hh:mm a'}}
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div ng-if="!unusedAddresses[0]">
|
<div class="addr-explanation" ng-if="showInfo">
|
||||||
<span class="item" translate>Not unused addresses available</span>
|
<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>
|
||||||
|
|
||||||
<div class="item item-divider" translate>
|
<div class="list">
|
||||||
Addresses With Balance
|
<div class="item item-divider item-icon-right" ng-click="addNewAddress()" translate>
|
||||||
</div>
|
Unused Addresses
|
||||||
|
<i class="icon ion-ios-plus-empty"></i>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="item" ng-repeat="addr in addresses track by $index">
|
<div ng-if="unusedAddresses[0]">
|
||||||
{{addr.address}}
|
<div class="item" ng-repeat="uAddress in unusedAddresses track by $index">
|
||||||
<div>{{addr.balanceStr}}</div>
|
{{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>
|
||||||
</div>
|
</div>
|
||||||
</ion-content>
|
</ion-content>
|
||||||
|
|
Loading…
Reference in New Issue