status-im/status-react
2
0
Fork 0
mirror of https://github.com/status-im/status-react.git synced 2025-01-23 01:09:49 +00:00
Code Issues Projects Releases Wiki Activity

[16845] Wrong buttons background color on community home screen's page nav (#17003)

Browse Source
This commit is contained in:
Ibrahem Khalil 2023-10-03 19:37:11 +03:00 committed by GitHub
parent f5038f8e24
commit 26a702799c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 33 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
package.json.gpg Normal file
View File

Binary file not shown.

23
src/quo2/components/navigation/page_nav/view.cljs
View File

@ -20,7 +20,7 @@
:blur :grey})
(defn- page-nav-base
[{:keys [margin-top background on-press accessibility-label icon-name]
[{:keys [margin-top background on-press accessibility-label icon-name behind-overlay?]
:or {background :white}}
& children]
(into [rn/view {:style (style/container margin-top)}
@ -30,7 +30,9 @@
:icon-only? true
:size 32
:on-press on-press
:background (when (button-properties/backgrounds background) background)
:background (if behind-overlay?
:blur
(button-properties/backgrounds background))
:accessibility-label accessibility-label}
icon-name])]
children))
@ -38,7 +40,7 @@
(defn- right-section-spacing [] [rn/view {:style style/right-actions-spacing}])
(defn- add-right-buttons-xf
[max-actions background]
[max-actions background behind-overlay?]
(comp (filter map?)
(take max-actions)
(map (fn [{:keys [icon-name label] :as button-props}]
@ -48,7 +50,9 @@
:icon-only? icon-name
:size 32
:accessible true
:background (when (button-properties/backgrounds background) background))
:background (if behind-overlay?
:blur
(when (button-properties/backgrounds background) background)))
(or label icon-name)]))
(interpose [right-section-spacing])))
@ -64,7 +68,8 @@
emoji])
(defn- right-content
[{:keys [background content max-actions min-size? support-account-switcher? account-switcher]
[{:keys [background content max-actions min-size? support-account-switcher? account-switcher
behind-overlay?]
:or {support-account-switcher? true}}]
[rn/view (when min-size? {:style style/right-content-min-size})
(cond
@ -73,7 +78,7 @@
(coll? content)
(into [rn/view {:style style/right-actions-container}]
(add-right-buttons-xf max-actions background)
(add-right-buttons-xf max-actions background behind-overlay?)
content)
:else
@ -170,7 +175,8 @@
shown-name]]))
(defn- view-internal
[{:keys [type right-side background text-align account-switcher]
"behind-overlay is necessary for us to know if the page-nav buttons are under the bottom sheet overlay or not."
[{:keys [type right-side background text-align account-switcher behind-overlay?]
:or {type :no-title
text-align :center
right-side :none
@ -179,7 +185,8 @@
(case type
:no-title
[page-nav-base props
[right-content {:background background :content right-side :max-actions 3}]]
[right-content
{:background background :content right-side :max-actions 3 :behind-overlay? behind-overlay?}]]
:title
(let [centered? (= text-align :center)]

19
src/status_im2/common/scroll_page/view.cljs
View File

@ -24,7 +24,7 @@
(defn f-scroll-page-header
[scroll-height height name page-nav-right-side logo sticky-header top-nav title-colum navigate-back?
collapsed?]
collapsed? overlay-shown?]
(let [input-range [0 10]
output-range [-208 -45]
y (reanimated/use-shared-value scroll-height)
@ -69,12 +69,13 @@
[rn/view {:style {:margin-top 0}}
top-nav]
[quo/page-nav
(cond-> {:margin-top 44
:type :no-title
:background (if (= 1 (reanimated/get-shared-value opacity-animation))
:blur
:photo)
:right-side page-nav-right-side}
(cond-> {:margin-top 44
:type :no-title
:background (if (= 1 (reanimated/get-shared-value opacity-animation))
:blur
:photo)
:right-side page-nav-right-side
:overlay-shown? overlay-shown?}
navigate-back? (assoc :icon-name :i/close
:on-press #(rf/dispatch [:navigate-back])))])
(when title-colum
@ -106,12 +107,12 @@
(let [scroll-height (reagent/atom negative-scroll-position-0)]
(fn [{:keys [name theme cover-image logo page-nav-right-section-buttons on-scroll
collapsed?
height top-nav title-colum background-color navigate-back?]}
height top-nav title-colum background-color navigate-back? overlay-shown?]}
sticky-header
children]
[:<>
[:f> f-scroll-page-header @scroll-height height name page-nav-right-section-buttons
logo sticky-header top-nav title-colum navigate-back? collapsed?]
logo sticky-header top-nav title-colum navigate-back? collapsed? overlay-shown?]
[rn/scroll-view
{:content-container-style {:flex-grow 1}
:content-inset-adjustment-behavior :never

14
src/status_im2/contexts/communities/overview/view.cljs
View File

@ -312,9 +312,10 @@
;; user is on this page
initial-joined? joined]
(fn [{:keys [id name images] :as community} pending?]
(let [cover {:uri (get-in images [:banner :uri])}
logo {:uri (get-in images [:thumbnail :uri])}
collapsed? (and initial-joined? (:joined community))]
(let [cover {:uri (get-in images [:banner :uri])}
logo {:uri (get-in images [:thumbnail :uri])}
collapsed? (and initial-joined? (:joined community))
overlay-shown? (boolean (:sheets (rf/sub [:bottom-sheet])))]
[scroll-page/scroll-page
{:cover-image cover
:collapsed? collapsed?
@ -324,7 +325,8 @@
:on-scroll #(reset! scroll-height %)
:navigate-back? true
:background-color (colors/theme-colors colors/white colors/neutral-95)
:height 148}
:height 148
:overlay-shown? overlay-shown?}
[sticky-category-header
{:enabled (> @scroll-height @first-channel-height)
:label (pick-first-category-by-height
@ -337,8 +339,8 @@
{:on-category-layout (partial add-category-height categories-heights)
:collapsed? collapsed?
:on-first-channel-height-changed
;; Here we set the height of the component and we filter out the
;; categories, as some might have been removed
;; Here we set the height of the component and we filter out the categories, as some might
;; have been removed.
(fn [height categories]
(swap! categories-heights select-keys categories)
(reset! first-channel-height height))}]]))))