From 914604bbe44d8c3e9399be93566a34ff45dfbe69 Mon Sep 17 00:00:00 2001
From: Omar Basem <omarbasem.0101@gmail.com>
Date: Wed, 23 Aug 2023 20:19:19 +0400
Subject: [PATCH] UI Fix: wallet graph gradient (#17093)

* fix: wallet graph gradient
---
 src/quo2/components/graph/wallet_graph/style.cljs     |  7 +++++--
 src/quo2/components/graph/wallet_graph/view.cljs      | 11 ++++++-----
 .../contexts/quo_preview/graph/wallet_graph.cljs      |  9 +++++----
 3 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/src/quo2/components/graph/wallet_graph/style.cljs b/src/quo2/components/graph/wallet_graph/style.cljs
index 558d66b219..5a228cc2fe 100644
--- a/src/quo2/components/graph/wallet_graph/style.cljs
+++ b/src/quo2/components/graph/wallet_graph/style.cljs
@@ -2,8 +2,11 @@
   (:require [quo2.foundations.colors :as colors]))
 
 (def gradient-background
-  {:height          294
-   :justify-content :flex-end})
+  {:height   294
+   :position :absolute
+   :left     0
+   :right    0
+   :bottom   0})
 
 (def x-axis-label-text-style ; We need this to remove unnecessary bottom spacing from graph
   {:margin-bottom -3
diff --git a/src/quo2/components/graph/wallet_graph/view.cljs b/src/quo2/components/graph/wallet_graph/view.cljs
index a55a00896f..90c022c7a2 100644
--- a/src/quo2/components/graph/wallet_graph/view.cljs
+++ b/src/quo2/components/graph/wallet_graph/view.cljs
@@ -37,11 +37,12 @@
         :style               style/illustration}
        [text/text {:style {:color colors/white}}
         "Illustration here"]]
-      [linear-gradient/linear-gradient
-       {:colors gradient-colors
-        :start  {:x 0 :y 1}
-        :end    {:x 0 :y 0}
-        :style  style/gradient-background}
+      [rn/view
+       [linear-gradient/linear-gradient
+        {:colors gradient-colors
+         :start  {:x 0 :y 1}
+         :end    {:x 0 :y 0}
+         :style  style/gradient-background}]
        [rn/view {:accessibility-label :line-chart}
         [charts/line-chart
          {:height                  96
diff --git a/src/status_im2/contexts/quo_preview/graph/wallet_graph.cljs b/src/status_im2/contexts/quo_preview/graph/wallet_graph.cljs
index 504e50e85c..505607b08a 100644
--- a/src/status_im2/contexts/quo_preview/graph/wallet_graph.cljs
+++ b/src/status_im2/contexts/quo_preview/graph/wallet_graph.cljs
@@ -69,10 +69,11 @@
       [rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!}
        [rn/view {:padding-bottom 150}
         [preview/customizer state descriptor]
-        [quo/wallet-graph
-         {:data       (generate-data (:time-frame @state))
-          :state      (:state @state)
-          :time-frame (:time-frame @state)}]]])))
+        [rn/view {:margin-top 300}
+         [quo/wallet-graph
+          {:data       (generate-data (:time-frame @state))
+           :state      (:state @state)
+           :time-frame (:time-frame @state)}]]]])))
 
 (defn preview-wallet-graph
   []