Fix for "Jump to" button overlapping Logout button on the Profile screen (#19318)
* Fix for "Jump to" button overlapping Logout button on the Profile screen * Fix for offsets * Code style * Fixes
This commit is contained in:
parent
1e37765197
commit
51541f7f0a
|
@ -1,13 +1,27 @@
|
|||
(ns status-im.contexts.profile.settings.style
|
||||
(:require [quo.foundations.colors :as colors]))
|
||||
(:require [quo.foundations.colors :as colors]
|
||||
[react-native.platform :as platform]
|
||||
[status-im.contexts.shell.jump-to.constants :as jump-to.constants]))
|
||||
|
||||
(defn navigation-wrapper
|
||||
[{:keys [customization-color inset theme]}]
|
||||
{:padding-top inset
|
||||
:background-color (colors/resolve-color customization-color theme 40)})
|
||||
|
||||
(def footer-container
|
||||
{:margin-top 8
|
||||
:margin-bottom 50
|
||||
:padding-horizontal 20
|
||||
:padding-vertical 12})
|
||||
(def ^:const footer-padding 20)
|
||||
(def ^:const ios-bottom-offset -10)
|
||||
|
||||
(defn footer-container
|
||||
[bottom]
|
||||
{:padding-horizontal footer-padding
|
||||
:padding-top footer-padding
|
||||
:padding-bottom (+ jump-to.constants/floating-shell-button-height
|
||||
footer-padding
|
||||
(if platform/ios? ios-bottom-offset bottom))})
|
||||
|
||||
(defn floating-shell-button-style
|
||||
[{:keys [bottom]}]
|
||||
{:position :absolute
|
||||
:bottom (if platform/ios?
|
||||
(+ bottom ios-bottom-offset)
|
||||
0)})
|
||||
|
|
|
@ -9,7 +9,6 @@
|
|||
[status-im.contexts.profile.settings.header.view :as settings.header]
|
||||
[status-im.contexts.profile.settings.list-items :as settings.items]
|
||||
[status-im.contexts.profile.settings.style :as style]
|
||||
[status-im.contexts.shell.jump-to.constants :as jump-to.constants]
|
||||
[utils.debounce :as debounce]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
@ -29,9 +28,9 @@
|
|||
(reanimated/set-shared-value scroll-y current-y)))
|
||||
|
||||
(defn- footer
|
||||
[logout-press]
|
||||
[{:keys [bottom]} logout-press]
|
||||
[rf/delay-render
|
||||
[rn/view {:style style/footer-container}
|
||||
[rn/view {:style (style/footer-container bottom)}
|
||||
[quo/logout-button {:on-press logout-press}]]])
|
||||
|
||||
(defn- get-item-layout
|
||||
|
@ -65,7 +64,7 @@
|
|||
:shows-vertical-scroll-indicator false
|
||||
:render-fn settings-item-view
|
||||
:get-item-layout get-item-layout
|
||||
:footer [footer logout-press]
|
||||
:footer [footer insets logout-press]
|
||||
:scroll-event-throttle 16
|
||||
:on-scroll #(scroll-handler % scroll-y)
|
||||
:bounces false}]
|
||||
|
@ -77,8 +76,7 @@
|
|||
(debounce/throttle-and-dispatch [:shell/navigate-to-jump-to] 500))
|
||||
:customization-color customization-color
|
||||
:label (i18n/label :t/jump-to)}}
|
||||
{:position :absolute
|
||||
:bottom jump-to.constants/floating-shell-button-height}]]))
|
||||
(style/floating-shell-button-style insets)]]))
|
||||
|
||||
(defn- internal-view
|
||||
[props]
|
||||
|
|
Loading…
Reference in New Issue