From 3b374e424e9675cff514bd3b0d943920d1d918dc Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Sun, 18 Nov 2018 18:28:53 +0100
Subject: [PATCH] Unify labels in section

---
 src/components/Textarea/index.js                   |  9 ++++-----
 src/components/inputs/Input/index.js               |  2 +-
 src/views/Wallet/components/Content/index.js       |  2 +-
 .../Wallet/components/LeftNavigation/index.js      |  1 -
 src/views/Wallet/components/Title/index.js         |  2 +-
 src/views/Wallet/views/Account/SignVerify/index.js | 14 +++++++-------
 6 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/src/components/Textarea/index.js b/src/components/Textarea/index.js
index 960b16c6..e556617a 100644
--- a/src/components/Textarea/index.js
+++ b/src/components/Textarea/index.js
@@ -18,10 +18,9 @@ const disabledColor = colors.TEXT_PRIMARY;
 const StyledTextarea = styled(Textarea)`
     width: 100%;
     min-height: 85px;
-    margin-bottom: 10px;
     padding: 10px 12px;
     box-sizing: border-box;
-    border: 1px solid ${props => (props.borderColor ? props.borderColor : colors.DIVIDER)};
+    border: 1px solid ${props => (props.colorBorder ? props.colorBorder : colors.DIVIDER)};
     border-radius: 2px;
     resize: none;
     outline: none;
@@ -95,7 +94,7 @@ const StyledTextarea = styled(Textarea)`
 `;
 
 const TopLabel = styled.span`
-    padding-bottom: 4px;
+    padding-bottom: 8px;
     color: ${colors.TEXT_SECONDARY};
 `;
 
@@ -159,6 +158,7 @@ const TextArea = ({
     state = '',
     bottomText = '',
     trezorAction = null,
+    ...rest
 }) => (
     <Wrapper className={className}>
         {topLabel && (
@@ -179,8 +179,7 @@ const TextArea = ({
             value={value}
             placeholder={placeholder}
             onChange={onChange}
-            borderColor={getColor(state)}
-            trezorAction={trezorAction}
+            {... rest}
         />
         <TrezorAction action={trezorAction}>
             <ArrowUp />{trezorAction}
diff --git a/src/components/inputs/Input/index.js b/src/components/inputs/Input/index.js
index f471b722..984ac52d 100644
--- a/src/components/inputs/Input/index.js
+++ b/src/components/inputs/Input/index.js
@@ -29,7 +29,7 @@ const InputIconWrapper = styled.div`
 `;
 
 const TopLabel = styled.span`
-    padding-bottom: 10px;
+    padding-bottom: 8px;
     color: ${colors.TEXT_SECONDARY};
 `;
 
diff --git a/src/views/Wallet/components/Content/index.js b/src/views/Wallet/components/Content/index.js
index 3c02272e..da009407 100644
--- a/src/views/Wallet/components/Content/index.js
+++ b/src/views/Wallet/components/Content/index.js
@@ -58,7 +58,7 @@ const Content = ({
 );
 
 Content.propTypes = {
-    children: PropTypes.element,
+    children: PropTypes.oneOfType([PropTypes.element, PropTypes.array]),
     isLoading: PropTypes.bool,
     title: PropTypes.string,
     message: PropTypes.string,
diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index a19995db..f2ae15cf 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -248,7 +248,6 @@ LeftNavigation.propTypes = {
     wallet: PropTypes.object,
     devices: PropTypes.array,
     pending: PropTypes.array,
-
     toggleDeviceDropdown: PropTypes.func,
     addAccount: PropTypes.func,
     acquireDevice: PropTypes.func,
diff --git a/src/views/Wallet/components/Title/index.js b/src/views/Wallet/components/Title/index.js
index 67541dfa..9745e1dc 100644
--- a/src/views/Wallet/components/Title/index.js
+++ b/src/views/Wallet/components/Title/index.js
@@ -8,7 +8,7 @@ const Wrapper = styled.div`
     font-size: ${FONT_SIZE.WALLET_TITLE};
     font-weight: ${FONT_WEIGHT.BASE};
     color: ${colors.WALLET_TITLE};
-    padding-bottom: 25px;
+    padding-bottom: 35px;
 `;
 
 const Title = ({
diff --git a/src/views/Wallet/views/Account/SignVerify/index.js b/src/views/Wallet/views/Account/SignVerify/index.js
index 7d356505..74fb21e4 100644
--- a/src/views/Wallet/views/Account/SignVerify/index.js
+++ b/src/views/Wallet/views/Account/SignVerify/index.js
@@ -20,7 +20,7 @@ const Wrapper = styled.div`
 `;
 
 const Row = styled.div`
-    padding: 0 0 10px 0;
+    padding: 0 0 25px 0;
 `;
 
 const RowButtons = styled(Row)`
@@ -108,8 +108,8 @@ class SignVerify extends Component<Props, State> {
                 <Wrapper>
                     <Sign>
                         <Row>
-                            <Label>Address</Label>
                             <Input
+                                topLabel="Address"
                                 name="signAddress"
                                 value={account.address}
                                 height={50}
@@ -119,8 +119,8 @@ class SignVerify extends Component<Props, State> {
                             />
                         </Row>
                         <Row>
-                            <Label>Message</Label>
                             <Textarea
+                                topLabel="Message"
                                 name="signMessage"
                                 value={this.state.signMessage}
                                 onChange={this.handleInputChange}
@@ -130,8 +130,8 @@ class SignVerify extends Component<Props, State> {
                             />
                         </Row>
                         <Row>
-                            <Label>Signature</Label>
                             <Textarea
+                                topLabel="Signature"
                                 name="signSignature"
                                 value={signature}
                                 rows={4}
@@ -154,8 +154,8 @@ class SignVerify extends Component<Props, State> {
                     </Sign>
                     <Verify>
                         <Row>
-                            <Label>Address</Label>
                             <Input
+                                topLabel="Address"
                                 name="verifyAddress"
                                 value={this.state.verifyAddress}
                                 onChange={this.handleInputChange}
@@ -166,8 +166,8 @@ class SignVerify extends Component<Props, State> {
                             />
                         </Row>
                         <Row>
-                            <Label>Message</Label>
                             <Textarea
+                                topLabel="Message"
                                 name="verifyMessage"
                                 value={this.state.verifyMessage}
                                 onChange={this.handleInputChange}
@@ -177,8 +177,8 @@ class SignVerify extends Component<Props, State> {
                             />
                         </Row>
                         <Row>
-                            <Label>Signature</Label>
                             <Textarea
+                                topLabel="Signature"
                                 name="verifySignature"
                                 value={this.state.verifySignature}
                                 onChange={this.handleInputChange}