fix(Layout): fix overflow scrolling issue

blockchain · Jan 31, 2020 · 372f2ae · 372f2ae
1 parent c1cb17b
commit 372f2ae
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 8 deletions.
diff --git a/packages/blockchain-wallet-v4-frontend/src/layouts/Wallet/template.js b/packages/blockchain-wallet-v4-frontend/src/layouts/Wallet/template.js
@@ -1,7 +1,6 @@
 import { replace } from 'ramda'
 import Alerts from 'components/Alerts'
 import ErrorBoundary from 'providers/ErrorBoundaryProvider'
-import ExchangeMenu from 'scenes/Exchange/Menu'
 import ExchangeProfileMenu from 'scenes/Settings/Profile/Menu'
 import Header from './Header'
 import MenuLeft from './MenuLeft'
@@ -20,9 +19,9 @@ const Wrapper = styled.div`
 `
 const Container = styled.div`
   display: flex;
-  position: relative;
   height: 100%;
   width: 100%;
+  overflow-y: auto;
 `
 const Nav = styled.div`
   flex: 0 0 60px;
@@ -61,11 +60,6 @@ const WalletLayout = props => {
           <MenuLeft location={location} />
           <TrayRight />
           <Content data-e2e={`page${replace(/\//g, '-', location.pathname)}`}>
-            {location.pathname.includes('/swap') && (
-              <ExchangeMenu
-                historySelected={location.pathname.includes('/swap/history')}
-              />
-            )}
             {location.pathname.includes('/settings/addresses') && (
               <SettingsAddressesMenu location={location} />
             )}

diff --git a/packages/blockchain-wallet-v4-frontend/src/scenes/Exchange/Menu/index.js b/packages/blockchain-wallet-v4-frontend/src/scenes/Exchange/Menu/index.js
@@ -11,8 +11,11 @@ import React from 'react'
 import styled from 'styled-components'
 
 const Wrapper = styled.div`
+  background-color: ${props => props.theme.white};
   position: sticky;
   width: 100%;
+  z-index: 1;
+  top: 0;
 `
 
 const SupportButton = styled(Button)`

diff --git a/packages/blockchain-wallet-v4-frontend/src/scenes/Exchange/index.js b/packages/blockchain-wallet-v4-frontend/src/scenes/Exchange/index.js
@@ -8,6 +8,7 @@ import EmailRequired from 'components/EmailRequired'
 import Exchange from './ExchangeContainer'
 import GetStarted from './GetStarted'
 import media from 'services/ResponsiveService'
+import Menu from './Menu'
 import React from 'react'
 import styled from 'styled-components'
 
@@ -16,7 +17,6 @@ const Wrapper = styled.div`
   height: 100%;
   display: flex;
   flex-direction: column;
-  min-height: 600px;
 `
 
 const Container = styled.section`
@@ -58,6 +58,7 @@ export const ExchangeScene = ({
       <Wrapper>
         {userCreated ? (
           <>
+            <Menu />
             <Container>
               <Column>
                 <Exchange