From 8342972059218d8d83ce065e7d91d48730bfad73 Mon Sep 17 00:00:00 2001 From: Gheorghe Pinzaru Date: Wed, 17 Jun 2020 10:15:22 +0300 Subject: [PATCH] Android tabbar replace elevation with border Signed-off-by: Gheorghe Pinzaru --- .../ui/components/tabbar/styles.cljs | 66 +++++++++---------- 1 file changed, 33 insertions(+), 33 deletions(-) diff --git a/src/status_im/ui/components/tabbar/styles.cljs b/src/status_im/ui/components/tabbar/styles.cljs index 196c71968a..f311eb1760 100644 --- a/src/status_im/ui/components/tabbar/styles.cljs +++ b/src/status_im/ui/components/tabbar/styles.cljs @@ -3,10 +3,7 @@ [status-im.ui.components.colors :as colors] [status-im.utils.platform :as platform])) -(def tabs-height - (cond - platform/android? 52 - platform/ios? 52)) +(def tabs-height 52) (def minimized-tabs-height 36) @@ -48,18 +45,17 @@ :height tabs-height}) (def tab-container - {:flex 1 - :height tabs-height - :align-items :center - :justify-content :space-between - :padding-top 6 - :padding 4}) + {:flex 1 + :height tabs-height + :align-items :center + :padding-top 6 + :padding-bottom 5}) (def icon-container - {:height 24 - :width 42 - :align-items :center - :justify-content :center}) + {:height 24 + :width 42 + :align-items :center + :justify-content :center}) (defn icon [active?] {:color (if active? colors/blue colors/gray) @@ -68,30 +64,35 @@ (def tab-title-container {:align-self :stretch - :height 14 + :height 13 + :margin-top 4 :align-items :center :justify-content :center}) (defn tab-title [active?] - {:color (if active? colors/blue colors/gray) - :font-size 11}) + {:color (if active? colors/blue colors/gray) + :line-height 13 + :font-size 11}) (defn animated-container [visible? inset] - {:flex-direction :row - :shadow-radius 4 - :shadow-offset {:width 0 :height -5} - :shadow-opacity 0.3 - :shadow-color (if (colors/dark?) - "rgba(0, 0, 0, 0.75)" - "rgba(0, 9, 26, 0.12)") - :elevation 8 - :background-color colors/white - :position :absolute - :left 0 - :right 0 - :height tabs-height - :bottom inset - :transform [{:translateY (animated/mix visible? tabs-diff 0)}]}) + (merge + {:flex-direction :row + :background-color colors/white + :position :absolute + :left 0 + :right 0 + :height tabs-height + :bottom inset + :transform [{:translateY (animated/mix visible? tabs-diff 0)}]} + (if platform/android? + {:border-top-width 1 + :border-top-color colors/gray-lighter} + {:shadow-radius 4 + :shadow-offset {:width 0 :height -5} + :shadow-opacity 0.3 + :shadow-color (if (colors/dark?) + "rgba(0, 0, 0, 0.75)" + "rgba(0, 9, 26, 0.12)")}))) (defn ios-titles-cover [inset] {:background-color colors/white @@ -104,7 +105,6 @@ (defn tabs-wrapper [keyboard visible] (merge {:padding-horizontal 8 - :elevation 8 :left 0 :right 0 :bottom 0