status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

[ #12338] "Reset with mnemonic" and "Access exisiting keys" are overlapping on small screens 

Signed-off-by: andrey <motor4ik@gmail.com>
This commit is contained in:
andrey 2021-07-23 11:23:50 +02:00
parent d727338e9a
commit b292e7ea5a
No known key found for this signature in database
GPG Key ID: 89B67245FD2F0272
1 changed files with 74 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

147
src/status_im/ui/screens/keycard/views.cljs
View File

@ -296,83 +296,84 @@
:keycard.login.pin.ui/cancel-pressed)])}} :keycard.login.pin.ui/cancel-pressed)])}}
(when (#{:reset :reset-confirmation} enter-step) (when (#{:reset :reset-confirmation} enter-step)
{:subtitle (i18n/label :t/keycard-enter-new-passcode {:step (if (= :reset enter-step) 1 2)})}))] {:subtitle (i18n/label :t/keycard-enter-new-passcode {:step (if (= :reset enter-step) 1 2)})}))]
[react/view {:flex 1 [react/scroll-view {:style {:flex 1}}
:flex-direction :column [react/view {:flex 1
:justify-content :space-between :flex-direction :column
:align-items :center} :justify-content :space-between
[react/view {:flex-direction :column :align-items :center}
:justify-content :center [react/view {:flex-direction :column
:align-items :center :justify-content :center
:height 140}
[react/view {:margin-horizontal 16
:flex-direction :column}
[react/view {:justify-content :center
:align-items :center
:flex-direction :row}
[react/view {:width (if small-screen? 50 69)
:height (if small-screen? 50 69)
:justify-content :center
:align-items :center}
[photo account small-screen?]
[react/view {:justify-content :center
:align-items :center
:width (if small-screen? 18 24)
:height (if small-screen? 18 24)
:border-radius (if small-screen? 18 24)
:position :absolute
:right 0
:bottom 0
:background-color colors/white
:border-width 1
:border-color colors/black-transparent}
[react/image {:source (resources/get-image :keycard-key)
:style {:width (if small-screen? 6 8)
:height (if small-screen? 11 14)}}]]]]
[react/text {:style {:text-align :center
:margin-top (if small-screen? 8 12)
:color colors/black
:font-weight "500"}
:number-of-lines 1
:ellipsize-mode :middle}
name]]]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:keycard-settings.ui/recovery-card-pressed (boolean login-multiaccount)])}
[react/view {:flex-direction :row
:align-items :center :align-items :center
:justify-content :center} :height 140}
[react/text {:style {:text-align :center [react/view {:margin-horizontal 16
:margin-bottom (if small-screen? 8 12) :flex-direction :column}
:color colors/blue}} [react/view {:justify-content :center
(string/lower-case (i18n/label (if login-multiaccount :t/keycard-recover :t/keycard-is-frozen-factory-reset)))]]] :align-items :center
(cond :flex-direction :row}
(= :after-unblocking status) [react/view {:width (if small-screen? 50 69)
[access-is-reset :height (if small-screen? 50 69)
{:hide-login-actions? hide-login-actions?}] :justify-content :center
:align-items :center}
[photo account small-screen?]
[react/view {:justify-content :center
:align-items :center
:width (if small-screen? 18 24)
:height (if small-screen? 18 24)
:border-radius (if small-screen? 18 24)
:position :absolute
:right 0
:bottom 0
:background-color colors/white
:border-width 1
:border-color colors/black-transparent}
[react/image {:source (resources/get-image :keycard-key)
:style {:width (if small-screen? 6 8)
:height (if small-screen? 11 14)}}]]]]
[react/text {:style {:text-align :center
:margin-top (if small-screen? 8 12)
:color colors/black
:font-weight "500"}
:number-of-lines 1
:ellipsize-mode :middle}
name]]]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:keycard-settings.ui/recovery-card-pressed (boolean login-multiaccount)])}
[react/view {:flex-direction :row
:align-items :center
:justify-content :center}
[react/text {:style {:text-align :center
:margin-bottom (if small-screen? 8 12)
:color colors/blue}}
(string/lower-case (i18n/label (if login-multiaccount :t/keycard-recover :t/keycard-is-frozen-factory-reset)))]]]
(cond
(= :after-unblocking status)
[access-is-reset
{:hide-login-actions? hide-login-actions?}]
(= :frozen-card status) (= :frozen-card status)
[frozen-card] [frozen-card]
(= :blocked-card status) (= :blocked-card status)
[blocked-card] [blocked-card]
:else :else
[pin.views/pin-view [pin.views/pin-view
{:pin pin {:pin pin
:retry-counter retry-counter :retry-counter retry-counter
:small-screen? small-screen? :small-screen? small-screen?
:status status :status status
:error-label error-label :error-label error-label
:step enter-step :step enter-step
:save-password-checkbox? (not (contains? :save-password-checkbox? (not (contains?
#{:reset :reset-confirmation :puk} #{:reset :reset-confirmation :puk}
enter-step))}]) enter-step))}])
(if hide-login-actions? (if hide-login-actions?
[react/view {:flex-direction :row [react/view {:flex-direction :row
:height 32}] :height 32}]
[toolbar/toolbar [toolbar/toolbar
{:center [quo/button {:center [quo/button
{:on-press #(re-frame/dispatch [:multiaccounts.recover.ui/recover-multiaccount-button-pressed]) {:on-press #(re-frame/dispatch [:multiaccounts.recover.ui/recover-multiaccount-button-pressed])
:type :secondary} :type :secondary}
(i18n/label :t/recover-key)]}])]]))) (i18n/label :t/recover-key)]}])]]])))
(fx/defn get-new-key (fx/defn get-new-key
{:events [:multiaccounts.create.ui/get-new-key]} {:events [:multiaccounts.create.ui/get-new-key]}