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

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

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 {

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,7 +58,8 @@
<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>
<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">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<div class="bg icon-create-wallet"></div> <div class="bg icon-create-wallet"></div>
</i> </i>
@ -66,7 +67,7 @@
<i class="icon bp-arrow-right"></i> <i class="icon bp-arrow-right"></i>
</a> </a>
<a ng-repeat="wallet in wallets track by $index" <a ng-repeat="wallet in wallets track by $index"
class="item item-icon-left item-big-icon-left item-icon-right wallet" class="item item-sub item-icon-left item-big-icon-left item-icon-right wallet"
ng-click="openWallet(wallet)"> ng-click="openWallet(wallet)">
<i class="icon big-icon-svg"> <i class="icon big-icon-svg">
<img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}" class="bg"/> <img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}" class="bg"/>
@ -92,7 +93,7 @@
</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>
@ -102,13 +103,14 @@
<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>