From 19e3e983deb16e920f5db6e0a567be424ef93b24 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 10:21:41 +0200
Subject: [PATCH 01/16] Fixed width in navigation body

---
 src/views/Wallet/components/LeftNavigation/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index 15d2821f..6f38a2af 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -31,7 +31,7 @@ const Footer = styled.div`
 `;
 
 const Body = styled.div`
-    overflow: auto;
+    width: 320px;
     background: ${colors.LANDING};
 `;
 

From 8a8d17e08e6b49d42ff3b22dd6c9d50c55a65e73 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 10:24:51 +0200
Subject: [PATCH 02/16] Fixed footer

---
 src/views/Wallet/components/LeftNavigation/index.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index 6f38a2af..dda6669d 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -24,7 +24,8 @@ const TransitionContentWrapper = styled.div`
 `;
 
 const Footer = styled.div`
-    position: fixed;
+    position: relative;
+    width: 320px;
     bottom: 0;
     background: ${colors.MAIN};
     border-right: 1px solid ${colors.DIVIDER};

From 5ea44176bb773d4eea4d816c1e50fa254e491d87 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 11:14:24 +0200
Subject: [PATCH 03/16] Removed red background

---
 src/components/Tooltip/index.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/Tooltip/index.js b/src/components/Tooltip/index.js
index 656c0b19..3872a698 100644
--- a/src/components/Tooltip/index.js
+++ b/src/components/Tooltip/index.js
@@ -15,7 +15,6 @@ const Wrapper = styled.div`
         position: absolute;
         z-index: 1070;
         display: block;
-        background: red;
         visibility: visible;
         border: 1px solid ${colors.DIVIDER};
         border-radius: 3px;

From ad31b445f07e86cf44eccf48603fa274a07edb59 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 11:20:38 +0200
Subject: [PATCH 04/16] Removed background from navigation body

---
 .../components/LeftNavigation/components/AccountMenu/index.js  | 3 +--
 src/views/Wallet/components/LeftNavigation/index.js            | 1 -
 2 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js b/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
index 3b597266..a11cb848 100644
--- a/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
+++ b/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
@@ -20,7 +20,6 @@ import type { Props } from '../common';
 import Row from '../Row';
 import RowCoin from '../RowCoin';
 
-
 const Wrapper = styled.div``;
 
 const Text = styled.span`
@@ -115,7 +114,7 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
     const selectedCoin = config.coins.find(c => c.network === location.state.network);
 
     if (!selected || !selectedCoin) return;
-    
+
     const fiatRate = props.fiat.find(f => f.network === selectedCoin.network);
 
     const deviceAccounts: Accounts = findDeviceAccounts(accounts, selected, location.state.network);
diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index dda6669d..507d2c0e 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -33,7 +33,6 @@ const Footer = styled.div`
 
 const Body = styled.div`
     width: 320px;
-    background: ${colors.LANDING};
 `;
 
 const Help = styled.div`

From e867c521f758f41f0af351de346f58e764c52fc9 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 14:23:57 +0200
Subject: [PATCH 05/16] Refactor animation handling, update react-transition

---
 package.json                                  |  2 +-
 .../Wallet/components/LeftNavigation/index.js | 68 +++++++++----------
 yarn.lock                                     | 13 ++++
 3 files changed, 47 insertions(+), 36 deletions(-)

diff --git a/package.json b/package.json
index 3c57abf3..6d073dd9 100644
--- a/package.json
+++ b/package.json
@@ -47,7 +47,7 @@
         "react-router-redux": "next",
         "react-scale-text": "^1.2.2",
         "react-select": "2.0.0",
-        "react-transition-group": "^2.2.1",
+        "react-transition-group": "^2.4.0",
         "redbox-react": "^1.6.0",
         "redux": "4.0.0",
         "redux-logger": "^3.0.6",
diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index 15d2821f..62cbf8d7 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -58,6 +58,29 @@ const A = styled.a`
     }
 `;
 
+const Transition = ({ children, animationType }) => (
+    <TransitionGroupWrapper component="div">
+        <CSSTransition
+            key={animationType}
+            onExit={() => {
+                console.log('ON EXIT');
+                window.dispatchEvent(new Event('resize'));
+            }}
+            onEntering={el => console.warn('Entering', el)}
+            onExited={() => window.dispatchEvent(new Event('resize'))}
+            classNames={animationType}
+            appear={false}
+            timeout={20000}
+            in
+            out
+        >
+            <TransitionContentWrapper>
+                {children}
+            </TransitionContentWrapper>
+        </CSSTransition>
+    </TransitionGroupWrapper>
+);
+
 class LeftNavigation extends Component {
     constructor(props) {
         super(props);
@@ -96,39 +119,6 @@ class LeftNavigation extends Component {
         }
     }
 
-    // TODO: refactor to transition component for reuse of transitions
-    getMenuTransition(children) {
-        return (
-            <TransitionGroupWrapper component="div" className="transition-container">
-                <CSSTransition
-                    key={this.state.animationType}
-                    onEnter={() => {
-                        console.warn('ON ENTER');
-                    }}
-                    onEntering={() => {
-                        console.warn('ON ENTERING (ACTIVE)');
-                    }}
-                    onExit={() => {
-                        console.warn('ON EXIT');
-                        window.dispatchEvent(new Event('resize'));
-                    }}
-                    onExiting={() => {
-                        console.warn('ON EXITING (ACTIVE)');
-                    }}
-                    onExited={() => window.dispatchEvent(new Event('resize'))}
-                    classNames={this.state.animationType}
-                    appear={false}
-                    timeout={30000}
-                    in
-                    out
-                >
-                    <TransitionContentWrapper>
-                        {children}
-                    </TransitionContentWrapper>
-                </CSSTransition>
-            </TransitionGroupWrapper>);
-    }
-
     shouldRenderAccounts() {
         const { selectedDevice } = this.props.wallet;
         return selectedDevice
@@ -163,8 +153,16 @@ class LeftNavigation extends Component {
                 />
                 <Body>
                     {this.state.shouldRenderDeviceSelection && <DeviceMenu {...this.props} />}
-                    {this.shouldRenderAccounts() && this.getMenuTransition(<AccountMenu {...this.props} />)}
-                    {this.shouldRenderCoins() && this.getMenuTransition(<CoinMenu {...this.props} />)}
+                    {this.shouldRenderAccounts() && (
+                        <Transition animationType="slide-left">
+                            <AccountMenu {...this.props} />
+                        </Transition>
+                    )}
+                    {this.shouldRenderCoins() && (
+                        <Transition animationType="slide-right">
+                            <CoinMenu {...this.props} />
+                        </Transition>
+                    )}
                 </Body>
                 <Footer className="sticky-bottom">
                     <Help>
diff --git a/yarn.lock b/yarn.lock
index b45b201c..3a4c0e11 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3146,6 +3146,10 @@ dom-helpers@^3.2.0:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.2.1.tgz#3203e07fed217bd1f424b019735582fc37b2825a"
 
+dom-helpers@^3.3.1:
+  version "3.3.1"
+  resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.3.1.tgz#fc1a4e15ffdf60ddde03a480a9c0fece821dd4a6"
+
 dom-serializer@0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
@@ -8038,6 +8042,15 @@ react-transition-group@^2.2.1:
     prop-types "^15.5.8"
     warning "^3.0.0"
 
+react-transition-group@^2.4.0:
+  version "2.4.0"
+  resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.4.0.tgz#1d9391fabfd82e016f26fabd1eec329dbd922b5a"
+  dependencies:
+    dom-helpers "^3.3.1"
+    loose-envify "^1.3.1"
+    prop-types "^15.6.2"
+    react-lifecycles-compat "^3.0.4"
+
 "react@^15.4.2 || ^16.0.0":
   version "16.2.0"
   resolved "https://registry.yarnpkg.com/react/-/react-16.2.0.tgz#a31bd2dab89bff65d42134fa187f24d054c273ba"

From 73c94a374db3ec25c60344a84331d03b71a3030b Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 15:46:52 +0200
Subject: [PATCH 06/16] Fixed checkbox hover style

---
 src/components/Checkbox/index.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/Checkbox/index.js b/src/components/Checkbox/index.js
index 1f4eef2b..5e65eed9 100644
--- a/src/components/Checkbox/index.js
+++ b/src/components/Checkbox/index.js
@@ -34,8 +34,9 @@ const IconWrapper = styled.div`
 
     &:hover,
     &:focus {
-        border: 1px solid ${colors.TEXT_PRIMARY};
-        background: ${props => (props.checked ? colors.TEXT_PRIMARY : colors.WHITE)};
+        border: 1px solid ${colors.GREEN_PRIMARY};
+        color: ${colors.WHITE};
+        background: ${props => (props.checked ? colors.GREEN_PRIMARY : colors.WHITE)};
     }
 `;
 
@@ -74,7 +75,12 @@ class Checkbox extends PureComponent {
                 <IconWrapper checked={checked}>
                     {checked && (
                         <Tick>
-                            <Icon size={26} color={checked ? colors.WHITE : colors.GREEN_PRIMARY} icon={icons.SUCCESS} />
+                            <Icon
+                                hoverColor={colors.WHITE}
+                                size={26}
+                                color={checked ? colors.WHITE : colors.GREEN_PRIMARY}
+                                icon={icons.SUCCESS}
+                            />
                         </Tick>
                     )
                     }

From 41edcd6b7beccd942a69516b94b5490e1702bdb2 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Mon, 17 Sep 2018 16:50:59 +0200
Subject: [PATCH 07/16] Removed button for check device while unplugging

---
 src/views/Landing/components/ConnectDevice/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Landing/components/ConnectDevice/index.js b/src/views/Landing/components/ConnectDevice/index.js
index 443b49ae..3d249c1e 100644
--- a/src/views/Landing/components/ConnectDevice/index.js
+++ b/src/views/Landing/components/ConnectDevice/index.js
@@ -86,7 +86,7 @@ class ConnectDevice extends Component<Props> {
                         </React.Fragment>
                     )}
                 </ConnectTrezorWrapper>
-                {this.props.showWebUsb && (
+                {this.props.showWebUsb && !this.props.showDisconnect && (
                     <React.Fragment>
                         <P>and</P>
                         <Button isWebUsb>

From 65c977aed737729421574684f95d6e41f2952a38 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Tue, 18 Sep 2018 18:03:00 +0200
Subject: [PATCH 08/16] Fixed slide animation

---
 src/support/BaseStyles.js                     | 38 +++++++++++++++
 .../Wallet/components/LeftNavigation/index.js | 47 ++++++++++---------
 2 files changed, 63 insertions(+), 22 deletions(-)

diff --git a/src/support/BaseStyles.js b/src/support/BaseStyles.js
index bd8fd525..74e21313 100644
--- a/src/support/BaseStyles.js
+++ b/src/support/BaseStyles.js
@@ -63,6 +63,44 @@ const baseStyles = () => injectGlobal`
             url('./fonts/roboto/roboto-mono-v4-greek_cyrillic-ext_greek-ext_latin_cyrillic_vietnamese_latin-ext-regular.svg#RobotoMono') format('svg'); /* Legacy iOS */
     }
 
+    .slide-left-enter {
+        transform: translate(100%);
+        pointer-events: none;
+    }
+    
+    .slide-left-enter.slide-left-enter-active {
+        transform: translate(0%);
+        transition: transform 300ms ease-in-out;
+    }
+    
+    .slide-left-exit {
+        transform: translate(-100%);
+    }
+    
+    .slide-left-exit.slide-left-exit-active {
+        transform: translate(0%);
+        transition: transform 300ms ease-in-out;
+    }
+    
+    .slide-right-enter {
+        transform: translate(-100%);
+        pointer-events: none;
+    }
+    
+    .slide-right-enter.slide-right-enter-active {
+        transform: translate(0%);
+        transition: transform 300ms ease-in-out;
+    }
+    
+    .slide-right-exit {
+        transform: translate(-100%);
+    }
+    
+    .slide-right-exit.slide-right-exit-active {
+        transform: translate(-200%);
+        transition: transform 300ms ease-in-out;
+    }
+
 `;
 
 export default baseStyles;
\ No newline at end of file
diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index 96ea1e5a..97945c60 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -58,24 +58,20 @@ const A = styled.a`
     }
 `;
 
-const Transition = ({ children, animationType }) => (
-    <TransitionGroupWrapper component="div">
+const TransitionMenu = (props: TransitionMenuProps): React$Element<TransitionGroup> => (
+    <TransitionGroupWrapper component={null} className="transition-container">
         <CSSTransition
-            key={animationType}
-            onExit={() => {
-                console.log('ON EXIT');
-                window.dispatchEvent(new Event('resize'));
-            }}
-            onEntering={el => console.warn('Entering', el)}
+            key={props.animationType}
+            onExit={() => { window.dispatchEvent(new Event('resize')); }}
             onExited={() => window.dispatchEvent(new Event('resize'))}
-            classNames={animationType}
-            appear={false}
-            timeout={20000}
             in
             out
+            classNames={props.animationType}
+            appear={false}
+            timeout={300}
         >
             <TransitionContentWrapper>
-                {children}
+                { props.children }
             </TransitionContentWrapper>
         </CSSTransition>
     </TransitionGroupWrapper>
@@ -138,6 +134,22 @@ class LeftNavigation extends Component {
     }
 
     render() {
+        const { props } = this;
+        let menu;
+        if (this.shouldRenderAccounts()) {
+            menu = (
+                <TransitionMenu animationType="slide-left">
+                    <AccountMenu {...props} />
+                </TransitionMenu>
+            );
+        } else if (this.shouldRenderCoins()) {
+            menu = (
+                <TransitionMenu animationType="slide-right">
+                    <CoinMenu {...props} />
+                </TransitionMenu>
+            );
+        }
+
         return (
             <StickyContainer
                 location={this.props.location.pathname}
@@ -153,16 +165,7 @@ class LeftNavigation extends Component {
                 />
                 <Body>
                     {this.state.shouldRenderDeviceSelection && <DeviceMenu {...this.props} />}
-                    {this.shouldRenderAccounts() && (
-                        <Transition animationType="slide-left">
-                            <AccountMenu {...this.props} />
-                        </Transition>
-                    )}
-                    {this.shouldRenderCoins() && (
-                        <Transition animationType="slide-right">
-                            <CoinMenu {...this.props} />
-                        </Transition>
-                    )}
+                    {menu}
                 </Body>
                 <Footer className="sticky-bottom">
                     <Help>

From 31774283c4dd15e33882add7cb18b588c9fae0e1 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <volek.vladimir@gmail.com>
Date: Tue, 18 Sep 2018 20:51:38 +0200
Subject: [PATCH 09/16] fix component in transition

---
 src/views/Wallet/components/LeftNavigation/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Wallet/components/LeftNavigation/index.js b/src/views/Wallet/components/LeftNavigation/index.js
index 97945c60..ef3e79f9 100644
--- a/src/views/Wallet/components/LeftNavigation/index.js
+++ b/src/views/Wallet/components/LeftNavigation/index.js
@@ -59,7 +59,7 @@ const A = styled.a`
 `;
 
 const TransitionMenu = (props: TransitionMenuProps): React$Element<TransitionGroup> => (
-    <TransitionGroupWrapper component={null} className="transition-container">
+    <TransitionGroupWrapper component="div" className="transition-container">
         <CSSTransition
             key={props.animationType}
             onExit={() => { window.dispatchEvent(new Event('resize')); }}

From 25b268e8164d581e741fe7e5b5da3f78f1ed919c Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Wed, 19 Sep 2018 12:39:05 +0200
Subject: [PATCH 10/16] Fixed min width

---
 .../LeftNavigation/components/StickyContainer/index.js           | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js b/src/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js
index bab539c0..9a360f14 100644
--- a/src/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js
+++ b/src/views/Wallet/components/LeftNavigation/components/StickyContainer/index.js
@@ -19,6 +19,7 @@ const AsideWrapper = styled.aside`
     position: relative;
     top: 0;
     width: 320px;
+    min-width: 320px;
     overflow: hidden;
     background: ${colors.MAIN};
     border-right: 1px solid ${colors.DIVIDER};

From e9f938e5221d55f345b8f9db8547219ad3eb7ddc Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Wed, 19 Sep 2018 13:11:41 +0200
Subject: [PATCH 11/16] Fixed modal overflow

---
 src/components/modals/confirm/SignTx/index.js | 9 ++++++++-
 src/config/variables.js                       | 1 +
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/modals/confirm/SignTx/index.js b/src/components/modals/confirm/SignTx/index.js
index 351d0345..7b3110de 100644
--- a/src/components/modals/confirm/SignTx/index.js
+++ b/src/components/modals/confirm/SignTx/index.js
@@ -5,6 +5,7 @@ import P from 'components/Paragraph';
 import Icon from 'components/Icon';
 import icons from 'config/icons';
 import { H3 } from 'components/Heading';
+import { LINE_HEIGHT } from 'config/variables';
 
 const Wrapper = styled.div`
     width: 390px;
@@ -21,6 +22,12 @@ const Content = styled.div`
     padding: 24px 48px;
 `;
 
+const StyledP = styled(P)`
+    word-wrap: break-word;
+    padding: 5px 0;
+    line-height: ${LINE_HEIGHT.SMALL}
+`;
+
 const Label = styled.div`
     padding-top: 5px;
     font-size: 10px;
@@ -49,7 +56,7 @@ const ConfirmSignTx = (props) => {
                 <Label>Send</Label>
                 <P>{`${amount} ${currency}` }</P>
                 <Label>To</Label>
-                <P>{ address }</P>
+                <StyledP>{ address }</StyledP>
                 <Label>Fee</Label>
                 <P>{ selectedFeeLevel.label }</P>
             </Content>
diff --git a/src/config/variables.js b/src/config/variables.js
index 964c3873..542e6986 100644
--- a/src/config/variables.js
+++ b/src/config/variables.js
@@ -41,5 +41,6 @@ export const TRANSITION = {
 };
 
 export const LINE_HEIGHT = {
+    SMALL: '1.4',
     BASE: '1.8',
 };

From b851cc4770ebc5d8ec99024f715fd5c6da7e458e Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Wed, 19 Sep 2018 13:54:29 +0200
Subject: [PATCH 12/16] Removed placeholder for first account

---
 .../components/AccountMenu/index.js           | 22 +------------------
 yarn.lock                                     | 20 ++++++-----------
 2 files changed, 8 insertions(+), 34 deletions(-)

diff --git a/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js b/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
index a11cb848..f61dd37a 100644
--- a/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
+++ b/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
@@ -119,7 +119,7 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
 
     const deviceAccounts: Accounts = findDeviceAccounts(accounts, selected, location.state.network);
 
-    let selectedAccounts = deviceAccounts.map((account, i) => {
+    const selectedAccounts = deviceAccounts.map((account, i) => {
         // const url: string = `${baseUrl}/network/${location.state.network}/account/${i}`;
         const url: string = location.pathname.replace(/account+\/([0-9]*)/, `account/${i}`);
 
@@ -157,26 +157,6 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
         );
     });
 
-    if (selectedAccounts.length < 1) {
-        if (selected.connected) {
-            const url: string = location.pathname.replace(/account+\/([0-9]*)/, 'account/0');
-            selectedAccounts = (
-                <NavLink
-                    to={url}
-                >
-                    <Row column>
-                        <RowAccountWrapper
-                            isSelected
-                            borderTop
-                        >
-                            Account #1
-                        </RowAccountWrapper>
-                    </Row>
-                </NavLink>
-            );
-        }
-    }
-
     let discoveryStatus = null;
     const discovery = props.discovery.find(d => d.deviceState === selected.state && d.network === location.state.network);
 
diff --git a/yarn.lock b/yarn.lock
index 54011742..223897f6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -8055,13 +8055,6 @@ prop-types@15.x, prop-types@^15.5.10, prop-types@^15.5.4, prop-types@^15.5.8, pr
     loose-envify "^1.3.1"
     object-assign "^4.1.1"
 
-prop-types@>=15.5.10, prop-types@^15.6.2:
-  version "15.6.2"
-  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
-  dependencies:
-    loose-envify "^1.3.1"
-    object-assign "^4.1.1"
-
 prop-types@^15.6.1:
   version "15.6.1"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.1.tgz#36644453564255ddda391191fb3a125cbdf654ca"
@@ -8070,6 +8063,13 @@ prop-types@^15.6.1:
     loose-envify "^1.3.1"
     object-assign "^4.1.1"
 
+prop-types@^15.6.2:
+  version "15.6.2"
+  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
+  dependencies:
+    loose-envify "^1.3.1"
+    object-assign "^4.1.1"
+
 proxy-addr@~2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/proxy-addr/-/proxy-addr-2.0.3.tgz#355f262505a621646b3130a728eb647e22055341"
@@ -8402,12 +8402,6 @@ react-select@2.0.0:
     react-input-autosize "^2.2.1"
     react-transition-group "^2.2.1"
 
-react-sticky-el@^1.0.20:
-  version "1.0.20"
-  resolved "https://registry.yarnpkg.com/react-sticky-el/-/react-sticky-el-1.0.20.tgz#b3c5e7128218633f440dc67aec239d1cd078342d"
-  dependencies:
-    prop-types ">=15.5.10"
-
 react-transition-group@^2.2.1:
   version "2.2.1"
   resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.2.1.tgz#e9fb677b79e6455fd391b03823afe84849df4a10"

From 9bbed8d6f2d5dd21401b17f3ea6019e3c2da38ef Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Wed, 19 Sep 2018 14:16:39 +0200
Subject: [PATCH 13/16] Added hover transition

---
 .../components/LeftNavigation/components/RowCoin/index.js       | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/views/Wallet/components/LeftNavigation/components/RowCoin/index.js b/src/views/Wallet/components/LeftNavigation/components/RowCoin/index.js
index 6d704c3d..fa8506e3 100644
--- a/src/views/Wallet/components/LeftNavigation/components/RowCoin/index.js
+++ b/src/views/Wallet/components/LeftNavigation/components/RowCoin/index.js
@@ -20,6 +20,8 @@ const RowCoinWrapper = styled.div`
     display: block;
     font-size: ${FONT_SIZE.BASE};
     color: ${colors.TEXT_PRIMARY};
+    transition: background-color 0.3s, color 0.3s;
+    
     &:hover {
         background-color: ${colors.GRAY_LIGHT};
     }

From 93b70c1f0a1e79e42eaca2fd39d83b7b5223307c Mon Sep 17 00:00:00 2001
From: Szymon Lesisz <sz.lesisz@gmail.com>
Date: Thu, 20 Sep 2018 08:59:54 +0200
Subject: [PATCH 14/16] fixed address validation

added checksum validation if address contains any uppercase letter
---
 src/actions/SendFormActions.js | 38 ++++++++++++----------------------
 src/utils/ethUtils.js          | 15 +++++++++++++-
 2 files changed, 27 insertions(+), 26 deletions(-)

diff --git a/src/actions/SendFormActions.js b/src/actions/SendFormActions.js
index 6288c9d6..6b59279a 100644
--- a/src/actions/SendFormActions.js
+++ b/src/actions/SendFormActions.js
@@ -13,6 +13,7 @@ import { initialState } from 'reducers/SendFormReducer';
 import { findToken } from 'reducers/TokensReducer';
 import { findDevice, getPendingAmount, getPendingNonce } from 'reducers/utils';
 import * as stateUtils from 'reducers/utils';
+import { validateAddress } from 'utils/ethUtils';
 
 import type {
     Dispatch,
@@ -345,32 +346,19 @@ export const validation = (props: Props): void => {
     if (state.untouched) return;
     // valid address
     if (state.touched.address) {
-        /* if (state.address.length < 1) {
-            errors.address = 'Address is not set';
-        } else if (!EthereumjsUtil.isValidAddress(state.address)) {
-            errors.address = 'Address is not valid';
-        } else {
-            // address warning or info are set in addressValidation ThunkAction
-            // do not override this
-            if (state.warnings.address) {
-                warnings.address = state.warnings.address;
-            } else if (state.infos.address) {
-                infos.address = state.infos.address;
-            }
-        } */
-
-        /* eslint (no-lonely-if) */
-        if (state.address.length < 1) {
-            errors.address = 'Address is not set';
-        } else if (!EthereumjsUtil.isValidAddress(state.address)) {
-            errors.address = 'Address is not valid';
-        } else if (state.warnings.address) {
-            // address warning or info are set in addressValidation ThunkAction
-            // do not override this
+        const addressError = validateAddress(state.address);
+        if (addressError) {
+            errors.address = addressError;
+        }
+
+        // address warning or info may be set in addressValidation ThunkAction
+        // do not override them
+        if (state.warnings.address) {
             warnings.address = state.warnings.address;
-            if (state.infos.address) {
-                infos.address = state.infos.address;
-            }
+        }
+
+        if (state.infos.address) {
+            infos.address = state.infos.address;
         }
     }
 
diff --git a/src/utils/ethUtils.js b/src/utils/ethUtils.js
index 7b8ad313..82d5744a 100644
--- a/src/utils/ethUtils.js
+++ b/src/utils/ethUtils.js
@@ -1,6 +1,7 @@
 /* @flow */
 
 import BigNumber from 'bignumber.js';
+import EthereumjsUtil from 'ethereumjs-util';
 
 export const decimalToHex = (dec: number): string => new BigNumber(dec).toString(16);
 
@@ -28,4 +29,16 @@ export const strip = (str: string): string => {
     return padLeftEven(str);
 };
 
-export const calcGasPrice = (price: BigNumber, limit: string): string => price.times(limit).toString();
\ No newline at end of file
+export const calcGasPrice = (price: BigNumber, limit: string): string => price.times(limit).toString();
+
+export const validateAddress = (address: string): ?string => {
+    const hasUpperCase = new RegExp('^(.*[A-Z].*)$');
+    if (address.length < 1) {
+        return 'Address is not set';
+    } else if (!EthereumjsUtil.isValidAddress(address)) {
+        return 'Address is not valid';
+    } else if (address.match(hasUpperCase) && !EthereumjsUtil.isValidChecksumAddress(address)) {
+        return 'Address is not a valid checksum';
+    }
+    return null;
+}
\ No newline at end of file

From 2678cf3a95fce418dfde32f6c2c18ce504086762 Mon Sep 17 00:00:00 2001
From: Vladimir Volek <volek.vladimir@gmail.com>
Date: Thu, 20 Sep 2018 16:00:14 +0200
Subject: [PATCH 15/16] Fixed tooltip

---
 src/components/Tooltip/index.js                      | 12 +++++-------
 .../LeftNavigation/components/AccountMenu/index.js   |  7 ++++++-
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/components/Tooltip/index.js b/src/components/Tooltip/index.js
index 3872a698..8f94ad15 100644
--- a/src/components/Tooltip/index.js
+++ b/src/components/Tooltip/index.js
@@ -3,15 +3,10 @@ import RcTooltip from 'rc-tooltip';
 import colors from 'config/colors';
 import styled from 'styled-components';
 import PropTypes from 'prop-types';
-import { FONT_SIZE } from 'config/variables';
-
-const TooltipContent = styled.div`
-    width: ${props => (props.isAside ? '260px' : '320px')};
-    font-size: ${FONT_SIZE.SMALLEST};
-`;
 
 const Wrapper = styled.div`
     .rc-tooltip {
+        max-width: ${props => `${props.maxWidth}px` || 'auto'};
         position: absolute;
         z-index: 1070;
         display: block;
@@ -177,9 +172,11 @@ class Tooltip extends Component {
             placement,
             content,
             children,
+            maxWidth,
         } = this.props;
         return (
             <Wrapper
+                maxWidth={maxWidth}
                 className={className}
                 innerRef={(node) => { this.tooltipContainerRef = node; }}
             >
@@ -187,7 +184,7 @@ class Tooltip extends Component {
                     getTooltipContainer={() => this.tooltipContainerRef}
                     arrowContent={<div className="rc-tooltip-arrow-inner" />}
                     placement={placement}
-                    overlay={<TooltipContent>{content}</TooltipContent>}
+                    overlay={content}
                 >
                     {children}
                 </RcTooltip>
@@ -203,6 +200,7 @@ Tooltip.propTypes = {
         PropTypes.element,
         PropTypes.string,
     ]),
+    maxWidth: PropTypes.number,
     content: PropTypes.oneOfType([
         PropTypes.element,
         PropTypes.string,
diff --git a/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js b/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
index f61dd37a..83dcbb4f 100644
--- a/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
+++ b/src/views/Wallet/components/LeftNavigation/components/AccountMenu/index.js
@@ -27,6 +27,10 @@ const Text = styled.span`
     color: ${colors.TEXT_SECONDARY};
 `;
 
+const TooltipContent = styled.div`
+    font-size: ${FONT_SIZE.SMALLEST};
+`;
+
 const RowAccountWrapper = styled.div`
     width: 100%;
     display: flex;
@@ -183,7 +187,8 @@ const AccountMenu = (props: Props): ?React$Element<string> => {
             } else {
                 discoveryStatus = (
                     <Tooltip
-                        content={<React.Fragment>To add a new account, last account must have some transactions.</React.Fragment>}
+                        maxWidth={300}
+                        content={<TooltipContent>To add a new account, last account must have some transactions.</TooltipContent>}
                         placement="bottom"
                     >
                         <Row>

From 0475c20be8b1e66f35d950081b9a242a625cd48d Mon Sep 17 00:00:00 2001
From: Vladimir Volek <vladimir.volek@satoshilabs.com>
Date: Fri, 21 Sep 2018 13:37:33 +0200
Subject: [PATCH 16/16] Flow errors as warnings

---
 webpack/dev.babel.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/webpack/dev.babel.js b/webpack/dev.babel.js
index f39a2e6e..792835cb 100644
--- a/webpack/dev.babel.js
+++ b/webpack/dev.babel.js
@@ -96,7 +96,9 @@ module.exports = {
         new webpack.DefinePlugin({
             COMMITHASH: JSON.stringify(gitRevisionPlugin.commithash()),
         }),
-        new FlowWebpackPlugin(),
+        new FlowWebpackPlugin({
+            reportingSeverity: 'warning'
+        }),
         new HtmlWebpackPlugin({
             chunks: ['index'],
             template: `${SRC}index.html`,