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 type { Props } from './types';
......@@ -10,43 +9,28 @@ import * as Layout from './components';
const LayoutDefault = ({ children }: Props) => {
return (
<>
<Global
styles={ css`
html {
height: -webkit-fill-available;
}
body {
height: 100vh;
height: -webkit-fill-available;
display: flex;
flex-direction: column;
}
#__next {
flex: 1;
display: flex;
flex-direction: column;
}
` }
/>
<Layout.Container overflowY="hidden" flex={ 1 } display="flex" flexDir="column">
<Layout.TopRow/>
<HeaderMobile hideSearchBar/>
<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>
</>
<Layout.Container
overflowY="hidden"
height={ [ '-webkit-fill-available', '100vh' ] }
display="flex"
flexDirection="column"
>
<Layout.TopRow/>
<HeaderMobile hideSearchBar/>
<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