From 2bde795e15bc68967b0755bc3aa86be6e89803d7 Mon Sep 17 00:00:00 2001
From: Nick Cardin <nick@cardin.email>
Date: Thu, 15 Sep 2016 13:51:23 -0400
Subject: [PATCH] update home tab icons

---
 public/views/tab-home.html   | 12 ++++++------
 src/sass/common.scss         |  9 ++++++---
 src/sass/views/tab-home.scss |  8 --------
 3 files changed, 12 insertions(+), 17 deletions(-)

diff --git a/public/views/tab-home.html b/public/views/tab-home.html
index d01eb6b2f..8cf79e18e 100644
--- a/public/views/tab-home.html
+++ b/public/views/tab-home.html
@@ -19,7 +19,7 @@
       </a>
     </div>
 
-    <div class="list card" ng-if="notifications[0]">
+    <div class="list card" ng-if="notifications.length > 0">
       <a class="item item-icon-right item-heading" ui-sref="tabs.activity" translate>
         Recent Activity
         <i class="icon nav-item-arrow-right"></i>
@@ -42,7 +42,7 @@
          class="item item-icon-left item-big-icon-left item-icon-right"
          ng-click="openWallet(wallet)">
         <i class="icon big-icon-svg">
-          <img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}"/>
+          <img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}" class="bg"/>
         </i>
         <h2>{{wallet.name || wallet.id}}</h2>
         <span  ng-show="wallet.n > 1" class="text-light">
@@ -89,28 +89,28 @@
       </div>
       <a ng-show="!wallets[1]" ui-sref="tabs.add" class="item item-icon-left item-big-icon-left item-icon-right">
        <i class="icon big-icon-svg">
-         <img class="icon-create-wallet"/>
+         <div class="bg icon-create-wallet"></div>
        </i>
         <span translate>Create a bitcoin wallet</span>
         <i class="icon nav-item-arrow-right"></i>
       </a>
       <a ng-show="!externalServices.BuyAndSell" ui-sref="buyandsell" class="item item-icon-left item-big-icon-left item-icon-right">
        <i class="icon big-icon-svg">
-         <img class="icon-buy-bitcoin"/>
+         <div class="bg icon-buy-bitcoin"></div>
        </i>
         <span translate>Buy Bitcoin</span>
         <i class="icon nav-item-arrow-right"></i>
       </a>
       <a ui-sref="bitpayCard.main" ng-show="!externalServices.BitpayCard" class="item item-icon-left item-big-icon-left item-icon-right">
        <i class="icon big-icon-svg">
-         <img class="icon-bitpay-card"/>
+         <div class="bg icon-bitpay-card"></div>
        </i>
         <span translate>Add BitPay Card</span>
         <i class="icon nav-item-arrow-right"></i>
       </a>
       <a ui-sref="amazon.main" ng-show="!externalServices.AmazonGiftCards" class="item item-icon-left item-big-icon-left item-icon-right">
         <i class="icon big-icon-svg">
-          <img class="icon-gift"/>
+          <div class="bg icon-gift"></div>
         </i>
         <span translate>Add Amazon Gift Card</span>
         <i class="icon nav-item-arrow-right"></i>
diff --git a/src/sass/common.scss b/src/sass/common.scss
index 1a8c2e6f8..3d287431c 100644
--- a/src/sass/common.scss
+++ b/src/sass/common.scss
@@ -25,13 +25,16 @@
     border-top: 0;
 }
 
-.icon.big-icon-svg {
+.big-icon-svg {
   padding: 0 7px;
-  > img {
+  > .bg {
     border-radius: 50%;
     width: 40px;
     height: 40px;
     box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.3);
+    background-repeat:no-repeat;
+    background-clip: padding-box;
+    background-size: 103%;
   }
 }
 .overlay {
@@ -83,4 +86,4 @@ ion-header-bar{
 
 .bold-text{
   font-weight: bold !important;
-}
\ No newline at end of file
+}
diff --git a/src/sass/views/tab-home.scss b/src/sass/views/tab-home.scss
index ef56a6403..8f40b2975 100644
--- a/src/sass/views/tab-home.scss
+++ b/src/sass/views/tab-home.scss
@@ -1,23 +1,15 @@
 #tab-home {
   .icon-create-wallet {
     background-image: url("../img/icon-bitcoin.svg");
-    background-repeat:no-repeat;
-    background-position: -5px -5px;
   }
   .icon-buy-bitcoin {
     background-image: url("../img/icon-gift.svg");
-    background-repeat: no-repeat;
-    background-position: -5px -6px;
   }
   .icon-bitpay-card {
     background-image: url("../img/icon-bitpay.svg");
-    background-repeat: no-repeat;
-    background-position: -5px -6px;
   }
   .icon-gift {
     background-image: url("../img/icon-gift.svg");
-    background-repeat: no-repeat;
-    background-position: -5px -6px;
   }
 
   a.item {