diff --git a/src/status_im/ui/components/common/common.cljs b/src/status_im/ui/components/common/common.cljs index 7ec6f334d2..854e428bdd 100644 --- a/src/status_im/ui/components/common/common.cljs +++ b/src/status_im/ui/components/common/common.cljs @@ -102,6 +102,9 @@ (assoc :accessibility-label accessibility-label)) (if more-than-9 (i18n/label :t/counter-9-plus) value)]]))) +(def small-screen-image-k 0.8) +(def small-screen-height 600) + (defview image-contain [{:keys [container-style style]} {:keys [image width height]}] (letsubs [content-width (reagent/atom 0) {window-width :width window-height :height} [:dimensions/window]] @@ -112,13 +115,13 @@ :style (merge style (if (> window-height window-width) {:width (* @content-width - (if (< window-height 600) - 0.6 + (if (< window-height small-screen-height) + small-screen-image-k 1)) :height (/ (* @content-width height - (if (< window-height 600) - 0.6 + (if (< window-height small-screen-height) + small-screen-image-k 1)) width)} {:width @content-width - :height (* window-height 0.6)}))}]])) + :height (* window-height small-screen-image-k)}))}]])) diff --git a/src/status_im/ui/components/common/styles.cljs b/src/status_im/ui/components/common/styles.cljs index 614a915d30..e0f4d5718a 100644 --- a/src/status_im/ui/components/common/styles.cljs +++ b/src/status_im/ui/components/common/styles.cljs @@ -140,4 +140,6 @@ :text-align :center}) (def image-contain - {:align-self :stretch}) + {:align-self :stretch + :align-items :center + :justify-content :center})