Merge pull request #539 from gre/TopGradient

add TopGradient for MainSideBar

src/components/MainSideBar/TopGradient.js

@@ -0,0 +1,19 @@
+// @flow
+
+import React from 'react'
+import styled from 'styled-components'
+
+const TopGradientBox = styled.div`
+  width: 100%;
+  height: 80px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  background: linear-gradient(#ffffff 40%, rgba(255, 255, 255, 0));
+  z-index: 2;
+  pointer-events: none;
+`
+
+const el = <TopGradientBox />
+
+export default () => el

src/components/MainSideBar/index.js

@@ -32,6 +32,7 @@ import IconExchange from 'icons/Exchange'
 
 import AccountListItem from './AccountListItem'
 import AddAccountButton from './AddAccountButton'
+import TopGradient from './TopGradient'
 
 const mapStateToProps = state => ({
   accounts: accountsSelector(state),
@@ -84,6 +85,7 @@ class MainSideBar extends PureComponent<Props> {
 
     return (
       <Box relative bg="white" style={{ width: 230 }}>
+        <TopGradient />
         <GrowScroll>
           <Space of={70} />
           <SideBarList title={t('app:sidebar.menu')}>