Fix android clipped elevation

Added some air on every card and unified common style

Increase elevation size

Signed-off-by: Gheorghe Pinzaru <feross95@gmail.com>

src/status_im/ui/screens/wallet/accounts/styles.cljs

@@ -2,38 +2,31 @@
   (:require [status-im.ui.components.colors :as colors]
             [status-im.ui.components.tabbar.styles :as tabs.styles]))
 
+(def card-common
+  {:margin-vertical   16
+   :margin-horizontal 8
+   :width             156
+   :height            145
+   :shadow-offset     {:width 0 :height 2}
+   :shadow-radius     8
+   :shadow-opacity    1
+   :shadow-color      "rgba(0, 9, 26, 0.12)"
+   :elevation         3
+   :border-radius     8})
+
 (defn card [color]
-  {:width            156
+  (merge card-common
-   :height           145
+         {:background-color   color
-   :margin-right     16
+          :justify-content    :space-between
-   :background-color color
+          :padding-horizontal 12
-   :shadow-offset    {:width 0 :height 2}
+          :padding-top        12
-   :shadow-radius    8
+          :padding-bottom     6}))
-   :shadow-opacity   1
-   :shadow-color     "rgba(0, 9, 26, 0.12)"
-   :elevation        2
-   :border-radius    8
-   :justify-content  :space-between
-   :padding          12
-   :padding-bottom   6
-   :margin-top       5
-   :margin-bottom    5})
 
 (def add-card
-  {:width            156
+  (merge card-common
-   :height           145
+         {:background-color colors/white
-   :margin-top       5
+          :justify-content  :center
-   :margin-right     5
+          :align-items      :center}))
-   :margin-bottom    5
-   :background-color colors/white
-   :shadow-offset    {:width 0 :height 2}
-   :shadow-radius    8
-   :shadow-opacity   1
-   :shadow-color     "rgba(0, 9, 26, 0.12)"
-   :elevation        2
-   :border-radius    8
-   :justify-content  :center
-   :align-items      :center})
 
 (def send-button-container
   {:position        :absolute
@@ -56,4 +49,4 @@
    :shadow-radius    6
    :shadow-opacity   1
    :shadow-color     "rgba(0, 12, 63, 0.2)"
-   :elevation        2})
+   :elevation        2})

src/status_im/ui/screens/wallet/accounts/views.cljs

@@ -160,9 +160,7 @@
     [react/scroll-view {:horizontal                        true
                         :shows-horizontal-scroll-indicator false}
      [react/view {:flex-direction     :row
-                  :padding-top        11
+                  :padding-horizontal 8}
-                  :padding-bottom     12
-                  :padding-horizontal 16}
       (for [account accounts]
         ^{:key account}
         [account-card account])