Merge pull request #420 from status-im/bug/multiline-input-#397
Fix for multiline message input (#397)
This commit is contained in:
commit
7fbda9cbab
|
@ -4,7 +4,7 @@
|
||||||
(def max-input-height 66)
|
(def max-input-height 66)
|
||||||
(def min-input-height 22)
|
(def min-input-height 22)
|
||||||
(def input-spacing-top 16)
|
(def input-spacing-top 16)
|
||||||
(def input-spacing-bottom 16)
|
(def input-spacing-bottom 18)
|
||||||
|
|
||||||
(def request-info-height 61)
|
(def request-info-height 61)
|
||||||
(def response-height-normal 211)
|
(def response-height-normal 211)
|
||||||
|
|
|
@ -10,29 +10,31 @@
|
||||||
(def input-container
|
(def input-container
|
||||||
{:flex-direction :column})
|
{:flex-direction :column})
|
||||||
|
|
||||||
(def input-view
|
(defn input-view [content-height]
|
||||||
{:flex-direction :row
|
{:flex-direction :row
|
||||||
:align-items :center
|
:align-items :center
|
||||||
:justify-content :center
|
:justify-content :center
|
||||||
:height 56
|
:height (+ (min (max min-input-height content-height) max-input-height)
|
||||||
|
input-spacing-top
|
||||||
|
input-spacing-bottom)
|
||||||
:background-color color-white})
|
:background-color color-white})
|
||||||
|
|
||||||
(def message-input-container
|
(defn message-input-container [content-height]
|
||||||
{:height 16.5
|
{:height (min (max min-input-height content-height) max-input-height)
|
||||||
:margin-top 20
|
:margin-top input-spacing-top
|
||||||
:margin-bottom 19.5
|
:margin-bottom input-spacing-bottom
|
||||||
:flex 1
|
:flex 1
|
||||||
:flex-direction :column
|
:flex-direction "column"
|
||||||
:margin-right 0})
|
:margin-right 0})
|
||||||
|
|
||||||
(def send-wrapper
|
(def send-wrapper
|
||||||
{:margin-bottom 10
|
{:margin-top 10
|
||||||
:margin-right 10
|
:margin-right 10
|
||||||
:width 36
|
:width 36
|
||||||
:flex 1
|
:flex 1
|
||||||
:flex-direction "column"
|
:flex-direction "column"
|
||||||
:align-items :center
|
:align-items :center
|
||||||
:justify-content :flex-end})
|
:justify-content :flex-start})
|
||||||
|
|
||||||
(def send-container
|
(def send-container
|
||||||
{:width 36
|
{:width 36
|
||||||
|
|
|
@ -51,7 +51,7 @@
|
||||||
:font-size 14
|
:font-size 14
|
||||||
:line-height 20
|
:line-height 20
|
||||||
:color text1-color
|
:color text1-color
|
||||||
:padding-top (when p/ios? -6)})
|
:padding-top 0})
|
||||||
|
|
||||||
(def smile-icon
|
(def smile-icon
|
||||||
{:width 20
|
{:width 20
|
||||||
|
|
|
@ -93,9 +93,9 @@
|
||||||
(fn [{:keys [input-options]}]
|
(fn [{:keys [input-options]}]
|
||||||
(let [{:keys [height]} (r/state component)]
|
(let [{:keys [height]} (r/state component)]
|
||||||
[view st/input-container
|
[view st/input-container
|
||||||
[view st/input-view
|
[view (st/input-view height)
|
||||||
[plain-message/commands-button height #(set-layout-size 0)]
|
[plain-message/commands-button height #(set-layout-size 0)]
|
||||||
[view st/message-input-container
|
[view (st/message-input-container height)
|
||||||
(if @command?
|
(if @command?
|
||||||
[command-input input-options @command]
|
[command-input input-options @command]
|
||||||
[message-input input-options set-layout-size])]
|
[message-input input-options set-layout-size])]
|
||||||
|
|
|
@ -102,5 +102,5 @@
|
||||||
)
|
)
|
||||||
:disabled @command?}
|
:disabled @command?}
|
||||||
[animated-view {:style (st/message-input-button-touchable container-width height)}
|
[animated-view {:style (st/message-input-button-touchable container-width height)}
|
||||||
[animated-view {:style (st/message-input-button buttons-scale 15)}
|
[animated-view {:style (st/message-input-button buttons-scale 16)}
|
||||||
[icon :smile st/smile-icon]]]])})))
|
[icon :smile st/smile-icon]]]])})))
|
||||||
|
|
Loading…
Reference in New Issue