anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

fix(home): correct subtle item divider details on home tab

Browse source 
fixes #428
This commit is contained in:
Jason Dreyzehner 2016-10-12 21:17:30 -04:00
commit 41c01250a0
2 changed files with 63 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

35
src/sass/views/tab-home.scss
View file

@ -22,6 +22,18 @@
border-top:none; border-top:none;
padding-bottom: 1.5rem; padding-bottom: 1.5rem;
padding-top:1.5rem; padding-top:1.5rem;
&.wallet{
.big-icon-svg{
& > .bg{
padding: .25rem
}
}
}
}
.item-sub {
&:first-child:before {
width: 100%
}
&:before { &:before {
display: block; display: block;
position: absolute; position: absolute;
@ -37,29 +49,6 @@
} }
} }
} }
&.item-heading{
&:before{
width:100% !important;
top:99%
}
}
&:nth-child(1){
&:before{
width:0;
}
}
&:nth-child(2):last-child{
&:before{
width:0;
}
}
&.wallet{
.big-icon-svg{
& > .bg{
padding: .25rem
}
}
}
} }
} }
.next-step.item { .next-step.item {

100
www/views/tab-home.html
View file

@ -34,7 +34,7 @@
<span class="badge badge-assertive m5t m10r" ng-show="txpsN>3"> {{txpsN}}</span> <span class="badge badge-assertive m5t m10r" ng-show="txpsN>3"> {{txpsN}}</span>
</a> </a>
<a ng-repeat="tx in txps" class="item" ng-click="openTxpModal(tx)"> <a ng-repeat="tx in txps" class="item item-sub" ng-click="openTxpModal(tx)">
<span ng-include="'views/includes/txp.html'"></span> <span ng-include="'views/includes/txp.html'"></span>
</a> </a>
</div> </div>
@ -48,7 +48,7 @@
<ion-spinner icon="lines"></ion-spinner> <ion-spinner icon="lines"></ion-spinner>
<div translate>Updating activity...</div> <div translate>Updating activity...</div>
</span> </span>
<a class="item activity" ng-repeat="notification in notifications" ng-click="openNotificationModal(notification)"> <a class="item item-sub activity" ng-repeat="notification in notifications" ng-click="openNotificationModal(notification)">
<span ng-include="'views/includes/walletActivity.html'"></span> <span ng-include="'views/includes/walletActivity.html'"></span>
</a> </a>
</div> </div>
@ -58,57 +58,59 @@
<span translate>Wallets</span> <span translate>Wallets</span>
<a ui-sref="tabs.add" ng-if="wallets[0]"><i class="icon ion-ios-plus-empty list-add-button"></i></a> <a ui-sref="tabs.add" ng-if="wallets[0]"><i class="icon ion-ios-plus-empty list-add-button"></i></a>
</div> </div>
<a ng-hide="wallets[0]" ui-sref="tabs.add" class="item item-icon-left item-big-icon-left item-icon-right next-step ng-hide"> <div>
<i class="icon big-icon-svg"> <a ng-if="!wallets[0]" ui-sref="tabs.add" class="item item-icon-left item-big-icon-left item-icon-right next-step ng-hide">
<div class="bg icon-create-wallet"></div> <i class="icon big-icon-svg">
</i> <div class="bg icon-create-wallet"></div>
<span translate>Create a bitcoin wallet</span> </i>
<i class="icon bp-arrow-right"></i> <span translate>Create a bitcoin wallet</span>
</a> <i class="icon bp-arrow-right"></i>
<a ng-repeat="wallet in wallets track by $index" </a>
class="item item-icon-left item-big-icon-left item-icon-right wallet" <a ng-repeat="wallet in wallets track by $index"
ng-click="openWallet(wallet)"> class="item item-sub item-icon-left item-big-icon-left item-icon-right wallet"
<i class="icon big-icon-svg"> ng-click="openWallet(wallet)">
<img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}" class="bg"/> <i class="icon big-icon-svg">
</i> <img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}" class="bg"/>
<span> </i>
{{wallet.name || wallet.id}} <span>
<span class="size-12 text-light" ng-if="wallet.n > 1"> {{wallet.name || wallet.id}}
{{wallet.m}}-of-{{wallet.n}} <span class="size-12 text-light" ng-if="wallet.n > 1">
{{wallet.m}}-of-{{wallet.n}}
</span>
</span> </span>
</span>
<p> <p>
<span ng-if="!wallet.isComplete()" class="assertive" translate> <span ng-if="!wallet.isComplete()" class="assertive" translate>
Incomplete Incomplete
</span> </span>
<span ng-if="wallet.isComplete()"> <span ng-if="wallet.isComplete()">
<span ng-if="!wallet.balanceHidden">{{wallet.status.availableBalanceStr}}</span> <span ng-if="!wallet.balanceHidden">{{wallet.status.availableBalanceStr}}</span>
<span ng-if="wallet.balanceHidden" translate>[Balance Hidden]</span> <span ng-if="wallet.balanceHidden" translate>[Balance Hidden]</span>
</span> </span>
&nbsp; &nbsp;
</p> </p>
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>
</a> </a>
<a ui-sref="tabs.bitpayCard" <a ui-sref="tabs.bitpayCard"
ng-if="wallets[0] && externalServices.BitpayCard && bitpayCardEnabled" ng-if="wallets[0] && externalServices.BitpayCard && bitpayCardEnabled"
class="item item-icon-left item-big-icon-left item-icon-right"> class="item item-sub item-icon-left item-big-icon-left item-icon-right">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<div class="bg icon-bitpay-card"></div> <div class="bg icon-bitpay-card"></div>
</i> </i>
<h2>BitPay Card</h2> <h2>BitPay Card</h2>
<p ng-if="!bitpayCard" translate>Add funds to get started</p> <p ng-if="!bitpayCard" translate>Add funds to get started</p>
<span ng-if="bitpayCard">${{bitpayCard.balance}}</span> <span ng-if="bitpayCard">${{bitpayCard.balance}}</span>
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>
</a> </a>
</div>
</div> </div>
<div class="list card" ng-if="wallets[0] && externalServices.BuyAndSell && (glideraEnabled || coinbaseEnabled)"> <div class="list card" ng-if="wallets[0] && externalServices.BuyAndSell && (glideraEnabled || coinbaseEnabled)">
<div class="item item-icon-right item-heading" translate> <div class="item item-sub item-icon-right item-heading" translate>
Buy &amp; Sell Bitcoin Buy &amp; Sell Bitcoin
<a ui-sref="tabs.buyandsell"><i class="icon ion-ios-plus-empty list-add-button"></i></a> <a ui-sref="tabs.buyandsell"><i class="icon ion-ios-plus-empty list-add-button"></i></a>
</div> </div>
<a ng-if="glideraEnabled" ui-sref="tabs.buyandsell.glidera" class="item item-icon-right"> <a ng-if="glideraEnabled" ui-sref="tabs.buyandsell.glidera" class="item item-sub item-icon-right">
<img src="img/glidera-logo.png" width="90"/> <img src="img/glidera-logo.png" width="90"/>
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>
</a> </a>
@ -119,7 +121,7 @@
</div> </div>
<div class="list card" ng-if="wallets[0] && externalServices.AmazonGiftCards && amazonEnabled"> <div class="list card" ng-if="wallets[0] && externalServices.AmazonGiftCards && amazonEnabled">
<a class="item item-icon-left item-icon-right item-big-icon-left" ui-sref="tabs.giftcards.amazon"> <a class="item item-sub item-icon-left item-icon-right item-big-icon-left" ui-sref="tabs.giftcards.amazon">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<div class="bg icon-amazon"></div> <div class="bg icon-amazon"></div>
</i> </i>
@ -136,21 +138,21 @@
<i class="icon bp-arrow-down" ng-show="hideNextSteps"></i> <i class="icon bp-arrow-down" ng-show="hideNextSteps"></i>
</div> </div>
<div ng-show="!hideNextSteps"> <div ng-show="!hideNextSteps">
<a ui-sref="tabs.bitpayCard" ng-show="!externalServices.BitpayCard && bitpayCardEnabled" class="item item-icon-left item-big-icon-left item-icon-right next-step"> <a ui-sref="tabs.bitpayCard" ng-if="!externalServices.BitpayCard && bitpayCardEnabled" class="item item-sub item-icon-left item-big-icon-left item-icon-right next-step">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<div class="bg icon-bitpay-card"></div> <div class="bg icon-bitpay-card"></div>
</i> </i>
<span translate>Add BitPay Visa&reg; Card</span> <span translate>Add BitPay Visa&reg; Card</span>
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>
</a> </a>
<a ng-show="!externalServices.BuyAndSell && (coinbaseEnabled || glideraEnabled)" ui-sref="tabs.buyandsell.glidera" class="item item-icon-left item-big-icon-left item-icon-right next-step"> <a ng-if="!externalServices.BuyAndSell && (coinbaseEnabled || glideraEnabled)" ui-sref="tabs.buyandsell.glidera" class="item item-sub item-icon-left item-big-icon-left item-icon-right next-step">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<div class="bg icon-buy-bitcoin"></div> <div class="bg icon-buy-bitcoin"></div>
</i> </i>
<span translate>Buy or Sell Bitcoin</span> <span translate>Buy or Sell Bitcoin</span>
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>
</a> </a>
<a ui-sref="tabs.giftcards.amazon" ng-show="!externalServices.AmazonGiftCards && amazonEnabled" class="item item-icon-left item-big-icon-left item-icon-right next-step"> <a ui-sref="tabs.giftcards.amazon" ng-if="!externalServices.AmazonGiftCards && amazonEnabled" class="item item-sub item-icon-left item-big-icon-left item-icon-right next-step">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<div class="bg icon-amazon"></div> <div class="bg icon-amazon"></div>
</i> </i>