33 lines
756 B
JavaScript

import Header from './Header';
import { AppMenu } from './Menu';
import { NavigationBar } from './Navigation';
import { NavigationProvider } from '@/context/navigation';
import { Media } from '@/styles/media';
import { max, min } from '@/styles/mq';
import styled from 'styled-components';
const Main = styled.main`
margin: 8px 0;
${max('laptop')} {
margin-bottom: 40px; // height of the navigation bar
}
${min('desktop-xl')} {
margin: 8px 10%;
}
`;
export default function Layout({ children, user }) {
return (
<NavigationProvider>
<Header />
{user?.admin ? <AppMenu /> : false}
<Main>{children}</Main>
<Media lessThan="laptop">
<NavigationBar />
</Media>
</NavigationProvider>
);
}