Andrey Shovkoplyas 2017-04-07 18:29:32 +03:00 committed by Roman Volosovskyi
parent 9987e1bd55
commit 2e67f5275b
10 changed files with 52 additions and 80 deletions

View File

@ -16,7 +16,7 @@
{:style st/gradient-top
:colors st/gradient-top-colors}]))
(defn separator [style wrapper-style]
(defn separator [style & [wrapper-style]]
[view (merge st/separator-wrapper wrapper-style)
[view (merge st/separator style)]])

View File

@ -33,10 +33,8 @@
(defstyle description-text
{:color common/color-gray4
:android {:margin-top 6
:height 14
:font-size 12}
:ios {:margin-top 4
:height 16
:font-size 14
:letter-spacing -0.2}})

View File

@ -45,10 +45,8 @@
[transactions [:transactions]
{:keys [password]} [:get :confirm-transactions]
confirmed? [:get-in [:transactions-list-ui-props :confirmed?]]]
{:component-did-update #(when-not (seq transactions) (rf/dispatch [:navigate-back]))
:component-will-unmount #(rf/dispatch [:set-in [:transactions-list-ui-props :confirmed?] false])}
[(if platform/ios? rn/keyboard-avoiding-view rn/view) (merge {:behavior :padding} st/transactions-screen)
[status-bar/status-bar {:type (if platform/ios? :transparent :main)}]
[toolbar-view transactions]

View File

@ -39,7 +39,7 @@
[current-account [:get-current-account]
recipient [:contact-by-address to]]
(let [recipient-name (or (:name recipient) to)]
[rn/view
[rn/view st/details-container
[detail-item (i18n/label :t/to) recipient-name true]
[detail-item (i18n/label :t/from) (:name current-account) true]
[detail-data data]]))
@ -48,16 +48,14 @@
[{:keys [id] :as transaction} [:get :selected-transaction]
{:keys [password]} [:get :confirm-transactions]
confirmed? [:get-in [:transaction-details-ui-props :confirmed?]]]
{:component-did-update #(when-not transaction (rf/dispatch [:navigate-to-modal :pending-transactions]))
:component-will-unmount #(rf/dispatch [:set-in [:transaction-details-ui-props :confirmed?] false])}
[(if platform/ios? rn/keyboard-avoiding-view rn/view) (merge {:behavior :padding} st/transactions-screen)
[status-bar/status-bar {:type (if platform/ios? :transparent :main)}]
[toolbar-view]
[rn/scroll-view st/details-screen-content-container
[transactions-list-item/view transaction #(rf/dispatch [:navigate-to-modal :pending-transactions])]
(when platform/ios? [common/separator {} st/details-separator])
[common/separator st/details-separator st/details-separator-wrapper]
[details transaction]]
(when confirmed? [password-form/view 1])
(let [confirm-text (if confirmed?

View File

@ -3,7 +3,7 @@
(:require [status-im.components.styles :as st]))
(def item
{:padding-vertical 20
{:padding-vertical 19
:padding-horizontal 16
:flex 1
:flex-direction :row

View File

@ -1,30 +1,9 @@
(ns status-im.transactions.styles.password-form
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.components.styles :as st]))
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.components.styles :as common]))
(defnstyle password-container [error?]
{:margin-bottom (if error? 42 24)
:padding-left 16
:ios {:border-top-width 1
:border-top-color st/color-white-transparent-2}})
(def password-title
{:color st/color-white
:font-size 15
:margin-top 16
:margin-bottom 12})
(def password-input-wrapper
{:position :relative
:height 52
:padding-top 0
:padding-bottom 0
:margin-bottom 0})
(defstyle password-input
{:color :white
:height 52
:padding-left 0
:padding-top 24
:android {:font-size 16}
:ios {:font-size 17}})
(defstyle password-container
{:android {:margin-bottom 27}
:ios {:margin-bottom 20
:border-top-width 1
:border-top-color common/color-white-transparent-2}})

View File

@ -1,13 +1,13 @@
(ns status-im.transactions.styles.screens
(:require-macros [status-im.utils.styles :refer [defstyle]])
(:require [status-im.components.styles :as st]
(:require [status-im.components.styles :as common]
[status-im.utils.platform :as platform]))
;; common
(def transactions-toolbar-background (if platform/ios?
st/color-dark-blue-2
st/color-dark-blue-1))
common/color-dark-blue-2
common/color-dark-blue-1))
(defstyle toolbar-title-container
{:flex 1
@ -19,25 +19,25 @@
:padding-bottom 16}})
(def toolbar-title-text
{:color st/color-white
{:color common/color-white
:font-size 17})
(defstyle toolbar-title-count
{:color st/color-white
{:color common/color-white
:font-size 17
:margin-left 8
:android {:opacity 0.2}
:ios {:opacity 0.6}})
(defstyle toolbar-border
{:ios {:background-color st/color-white
{:ios {:background-color common/color-white
:opacity 0.1}})
;; pending-transactions
(def transactions-screen
{:flex 1
:background-color st/color-dark-blue-2})
:background-color common/color-dark-blue-2})
(def transactions-screen-content-container
{:flex 1
@ -57,11 +57,18 @@
{:flex 1
:android {:padding-top 8}})
(def details-separator-wrapper
{:background-color common/color-dark-blue-2})
(def details-separator
{:margin-bottom 10
:margin-left 16
{:margin-left 16
:background-color common/color-white
:opacity 0.1})
(defstyle details-container
{:ios {:margin-top 10}
:android {:margin-top 0}})
(def details-item
{:margin-top 10
:padding-left 16
@ -71,7 +78,7 @@
(defstyle details-item-title
{:width 80
:font-size 15
:color st/color-white
:color common/color-white
:android {:opacity 0.2
:margin-right 24}
:ios {:opacity 0.5
@ -81,30 +88,30 @@
(defn details-item-content [name?]
{:font-size 15
:flex-shrink 1
:color (if name? st/color-light-blue st/color-white)})
:color (if name? common/color-light-blue common/color-white)})
(defstyle details-data
{:margin-top 16
:padding 16
:background-color st/color-dark-blue-3
{:padding 16
:margin-top 16
:background-color common/color-dark-blue-3
:ios {:margin-horizontal 16}})
(defstyle details-data-title
{:font-size 15
:color st/color-white
:color common/color-white
:android {:opacity 0.2}
:ios {:opacity 0.5}})
(def details-data-content
{:font-size 15
:color st/color-white
:color common/color-white
:margin-top 8})
;; confirmation-success
(def success-screen
{:flex 1
:background-color st/color-dark-blue-2})
:background-color common/color-dark-blue-2})
(def success-screen-content-container
{:flex 1
@ -112,7 +119,7 @@
:justify-content :center})
(def success-icon-container
{:background-color st/color-light-blue
{:background-color common/color-light-blue
:border-radius 100
:height 133
:width 133
@ -125,5 +132,5 @@
(def success-text
{:font-size 17
:color st/color-light-blue3
:color common/color-light-blue3
:margin-top 26})

View File

@ -25,8 +25,8 @@
[rn/touchable-highlight {:on-press #(do (rf/dispatch [:deny-transaction transaction-id])
(when on-deny (on-deny)))}
[rn/view {:style st/item-deny-btn}
[rn/image {:source {:uri :icon_close_white}
:style st/item-deny-btn-icon}]]])
[rn/image {:source {:uri :icon_close_white}
:style st/item-deny-btn-icon}]]])
(defview view [{:keys [to value id] :as transaction} on-deny]
[recipient [:contact-by-address to]]

View File

@ -2,28 +2,20 @@
(:require-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :as rf]
[status-im.components.react :as rn]
[status-im.components.styles :as common-st]
[status-im.components.text-field.view :as text-field]
[status-im.components.text-input-with-label.view :refer [text-input-with-label]]
[status-im.transactions.styles.password-form :as st]
[status-im.i18n :as i18n]))
(defview view [transaction-quantity]
[wrong-password? [:wrong-password?]]
(let [error? wrong-password?]
[rn/view (st/password-container error?)
[rn/text {:style st/password-title}
(i18n/label-pluralize transaction-quantity :t/enter-password-transactions)]
[text-field/text-field
{:editable true
:secure-text-entry true
:label-hidden? true
:error (when error? (i18n/label :t/wrong-password))
:error-color common-st/color-light-red2
:placeholder (i18n/label :t/password)
:placeholder-text-color common-st/color-white-transparent
:line-color common-st/color-light-blue
:focus-line-height 2
:wrapper-style st/password-input-wrapper
:input-style st/password-input
:auto-focus true
:on-change-text #(rf/dispatch [:set-in [:confirm-transactions :password] %])}]]))
[rn/view st/password-container
[text-input-with-label
{:label (i18n/label :t/password)
:description (i18n/label-pluralize transaction-quantity :t/enter-password-transactions)
:on-change-text #(rf/dispatch [:set-in [:confirm-transactions :password] %])
:style {:color :white}
:auto-focus true
:secure-text-entry true
:error (when error? (i18n/label :t/wrong-password))}]]))

View File

@ -278,8 +278,8 @@
:zero "No transactions confirmed"}
:transaction "Transaction"
:pending-transactions "Pending transactions"
:enter-password-transactions {:one "Enter your password to confirm the transaction"
:other "Enter your password to confirm the transactions"}
:enter-password-transactions {:one "Confirm transaction by entering your password"
:other "Confirm transactions by entering your password"}
:status "Status"
:pending-confirmation "Pending confirmation"
:recipient "Recipient"