Commit 5ab56b50 authored by Max Alekseenko's avatar Max Alekseenko

rework fullscreen on mobiles

parent 09df0fd1
import { Global, css } from '@emotion/react';
import React from 'react'; import React from 'react';
import type { Props } from './types'; import type { Props } from './types';
...@@ -10,43 +9,28 @@ import * as Layout from './components'; ...@@ -10,43 +9,28 @@ import * as Layout from './components';
const LayoutDefault = ({ children }: Props) => { const LayoutDefault = ({ children }: Props) => {
return ( return (
<> <Layout.Container
<Global overflowY="hidden"
styles={ css` height={ [ '-webkit-fill-available', '100vh' ] }
html { display="flex"
height: -webkit-fill-available; flexDirection="column"
} >
body { <Layout.TopRow/>
height: 100vh; <HeaderMobile hideSearchBar/>
height: -webkit-fill-available; <Layout.MainArea minH="auto" flex={ 1 }>
display: flex; <Layout.MainColumn
flex-direction: column; paddingTop={{ base: 0, lg: 0 }}
} paddingBottom={ 0 }
#__next { paddingX={{ base: 4, lg: 6 }}
flex: 1; >
display: flex; <AppErrorBoundary>
flex-direction: column; <Layout.Content pt={{ base: 0, lg: 2 }} flexGrow={ 1 }>
} { children }
` } </Layout.Content>
/> </AppErrorBoundary>
<Layout.Container overflowY="hidden" flex={ 1 } display="flex" flexDir="column"> </Layout.MainColumn>
<Layout.TopRow/> </Layout.MainArea>
<HeaderMobile hideSearchBar/> </Layout.Container>
<Layout.MainArea minH="auto" flex={ 1 }>
<Layout.MainColumn
paddingTop={{ base: 0, lg: 0 }}
paddingBottom={ 0 }
paddingX={{ base: 4, lg: 6 }}
>
<AppErrorBoundary>
<Layout.Content pt={{ base: 0, lg: 2 }} flexGrow={ 1 }>
{ children }
</Layout.Content>
</AppErrorBoundary>
</Layout.MainColumn>
</Layout.MainArea>
</Layout.Container>
</>
); );
}; };
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment