finished receive view styling for phone sizes

src/sass/views/includes/wallets.scss

@@ -3,6 +3,15 @@
     .swiper-container {
       width: 85% !important;
       overflow: visible;
+      position: absolute;
+      left: 50%;
+      top: 50%;
+      transform: translate(-50%, -50%);
+      @media (max-height: 600px){
+        &{
+          transform: translate(-50%, -58%);
+        }
+      }
     }
     .card {
       max-width: 350px;
@@ -17,6 +26,9 @@
       }
       .item{
         padding:.6rem;
+        &.noBalance{
+          padding:.6rem 1rem 1.7rem;
+        }
         span{
           clear:both;
           width: 100%;

src/sass/views/tab-receive.scss

@@ -13,8 +13,19 @@
   .scroll{height:100%;}
   #address {
     background: #fff;
-    height:80%;
+    height: calc(100vh - 33vh);
-    article{height: 100%;position: relative;}
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    flex-flow: column;
+    @media(max-height: 600px){
+      height: calc(100vh - 36vh);
+    }
+    article{
+      flex:1;
+      width: 100%;
+    }
     #bit-address{
       position: absolute;
       bottom:0;
@@ -52,26 +63,41 @@
       }
     }
     .qr {
-      padding: 13vh 0 5vh 0;
+      padding: calc(100vh - 85vh) 0 calc(100vh - 96vh);
+      @media(max-height: 700px){
+        padding: calc(100vh - 90vh) 0 calc(100vh - 96vh);
+      }
+      div{
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+    .share{
+      flex:1;
+      max-width: 120px;
+      .item{
+        i{left:25px;}
+      }
     }
     .backup {
       background-color: orange;
       color: #fff;
       position: absolute;
-      top: 5px;
+      top: 0;
       i {
         padding: 10px;
       }
     }
     @media (max-height: 600px){
       &{
-        height: 77%;
         .qr{
-          padding:6.5vh 0 2vh;
+          padding:6vh 0 0;
           div{
             transform: scale(.7);
           }
         }
+        #bit-address{position: realtive;}
       }
     }
   }
@@ -89,6 +115,7 @@
       position: absolute;
       left: 50%;
       transform: translateX(-50%);
+      z-index: 2;
     }
   }
   #first-time-tip {
@@ -131,6 +158,10 @@
     border-right: 1px solid rgb(228, 228, 228);
     padding-right: 10px;
   }
+  .wallets{
+    position: relative;
+    height: calc(100vh - 83vh);
+  }
 }
 
 @keyframes fadeIn {

www/views/includes/wallets.html

@@ -2,7 +2,7 @@
   <ion-slides class="slides" slider="data.slider" options="sliderOptions">
     <ion-slide-page ng-repeat="wallet in wallets track by $index">
       <div class="card" ng-click="slider.slideTo($index)">
-        <div class="item item-icon-left text-right">
+        <div class="item item-icon-left text-right" ng-class="{'noBalance': !wallet.status.availableBalanceStr}">
           <i class="icon big-icon-svg">
             <img src="img/icon-wallet.svg" ng-style="{'background-color': wallet.color}" class="bg"/>
           </i>

www/views/tab-receive.html

@@ -60,7 +60,7 @@
           </div>
         </div>
         <div class="row">
-          <div class="col col-50 center-block text-center" ng-show="isCordova && addr">
+          <div class="col col-50 center-block text-center share" ng-show="isCordova && addr">
             <div class="item item-icon-left" ng-click="shareAddress(addr)">
               <i class="icon ion-ios-upload-outline"></i>
               <span translate>Share</span>