From 1837d0b7af28656ac63c0747306e8a32641aa2b7 Mon Sep 17 00:00:00 2001
From: Jamal Jackson <jamal@bitpay.com>
Date: Wed, 28 Sep 2016 13:28:23 -0400
Subject: [PATCH] fix receive tab wallet icon slider on tablet

---
 src/sass/common.scss                 |  4 ++
 src/sass/views/includes/wallets.scss | 76 ++++++++++++++++++++--------
 2 files changed, 59 insertions(+), 21 deletions(-)

diff --git a/src/sass/common.scss b/src/sass/common.scss
index 5be328775..b2a7677af 100644
--- a/src/sass/common.scss
+++ b/src/sass/common.scss
@@ -112,3 +112,7 @@ ion-header-bar{
 .bold-text{
   font-weight: bold !important;
 }
+
+.card{
+  box-shadow:  0 2px 3px rgba(0, 0, 0, 0.3);
+}
diff --git a/src/sass/views/includes/wallets.scss b/src/sass/views/includes/wallets.scss
index 57a616a94..cf2626745 100644
--- a/src/sass/views/includes/wallets.scss
+++ b/src/sass/views/includes/wallets.scss
@@ -1,34 +1,68 @@
-.wallets{
-  .slides{
-    .swiper-container{
-      width:75% !important;
-      overflow:visible;
+.wallets {
+  .slides {
+    .swiper-container {
+      width: 75% !important;
+      overflow: visible;
     }
-    .card{
+    .card {
       padding: .7rem;
-      padding-left:.25rem;
-      padding-right:.25rem;
+      padding-left: .25rem;
+      padding-right: .25rem;
       border-radius: .25rem;
       max-width: 350px;
-    }
-    .swiper-slide{
-      width:100% !important;
-      max-width: 450px;
-      &.swiper-slide-prev, &.swiper-slide-next{
-        opacity: .2;
-        &:hover{
-          opacity: 1;
+      @media (min-width: 500px) {
+        & {
+          width: 350px;
+          position: relative;
+          margin: 1.5rem auto 0;
         }
       }
-      &.swiper-slide-prev{
-        left:-5%;
+    }
+    .swiper-slide {
+      width: 100% !important;
+      max-width: 450px;
+      @media (min-width: 500px) {
+        & {
+          margin: 0 auto;
+          display: block;
+          float: none;
+          max-width: none;
+        }
+        &.swiper-slide-next .card {
+          float: left;
+        }
+        &.swiper-slide-prev .card {
+          float: right;
+        }
       }
-      &.swiper-slide-next{
-        left:4%;
+      &.swiper-slide-prev,
+      &.swiper-slide-next {
+        opacity: .2;
+      }
+      &.swiper-slide-prev {
+        left: -5%;
+      }
+      &.swiper-slide-next {
+        left: 4%;
       }
     }
   }
-  .swiper-pagination{
+  .swiper-pagination {
     visibility: hidden;
   }
 }
+
+.platform-browser {
+  .wallets {
+    .slides {
+      .swiper-slide {
+        &.swiper-slide-prev,
+        &.swiper-slide-next {
+          &:hover {
+            opacity: 1;
+          }
+        }
+      }
+    }
+  }
+}