fix: removing scrollbar on swap with banner (#7434)
This commit is contained in:
parent
6e4746a7fe
commit
2c7381ff47
@ -5,9 +5,9 @@ import styled from 'styled-components'
|
||||
import { ButtonText, ThemedText } from 'theme/components'
|
||||
import { Z_INDEX } from 'theme/zIndex'
|
||||
|
||||
export const UK_BANNER_HEIGHT = 64
|
||||
export const UK_BANNER_HEIGHT_MD = 112
|
||||
export const UK_BANNER_HEIGHT_SM = 136
|
||||
export const UK_BANNER_HEIGHT = 65
|
||||
export const UK_BANNER_HEIGHT_MD = 113
|
||||
export const UK_BANNER_HEIGHT_SM = 137
|
||||
|
||||
const BannerWrapper = styled.div`
|
||||
position: relative;
|
||||
|
@ -32,14 +32,22 @@ import { RouteDefinition, routes, useRouterConfig } from './RouteDefinitions'
|
||||
|
||||
const AppChrome = lazy(() => import('./AppChrome'))
|
||||
|
||||
const BodyWrapper = styled.div`
|
||||
const BodyWrapper = styled.div<{ bannerIsVisible?: boolean }>`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
min-height: calc(100vh - ${({ bannerIsVisible }) => (bannerIsVisible ? UK_BANNER_HEIGHT : 0)}px);
|
||||
padding: ${({ theme }) => theme.navHeight}px 0px 5rem 0px;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
|
||||
@media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.md}px`}) {
|
||||
min-height: calc(100vh - ${({ bannerIsVisible }) => (bannerIsVisible ? UK_BANNER_HEIGHT_MD : 0)}px);
|
||||
}
|
||||
|
||||
@media only screen and (max-width: ${({ theme }) => `${theme.breakpoint.sm}px`}) {
|
||||
min-height: calc(100vh - ${({ bannerIsVisible }) => (bannerIsVisible ? UK_BANNER_HEIGHT_SM : 0)}px);
|
||||
}
|
||||
`
|
||||
|
||||
const MobileBottomBar = styled.div`
|
||||
@ -217,7 +225,7 @@ export default function App() {
|
||||
<HeaderWrapper transparent={isHeaderTransparent} bannerIsVisible={renderUkBannner} scrollY={scrollY}>
|
||||
<NavBar blur={isHeaderTransparent} />
|
||||
</HeaderWrapper>
|
||||
<BodyWrapper>
|
||||
<BodyWrapper bannerIsVisible={renderUkBannner}>
|
||||
<Suspense>
|
||||
<AppChrome />
|
||||
</Suspense>
|
||||
|
Loading…
Reference in New Issue
Block a user