openfood/components/layout/defaultLayout.tsx

35 lines
895 B
TypeScript

import { FC } from "react";
import { AppBar, Box, Container, Toolbar, Typography } from "@mui/material";
import { Styling } from "../general/styling";
import { DefaultNavbar } from "./defaultNavbar";
export const DefaultLayout: FC = ({ children }) => (
<Styling>
<Box
sx={{
display: "flex",
width: "100%",
minHeight: "100vh",
bgcolor: "background.default",
color: "text.primary",
flexDirection: "column",
}}
>
<AppBar position="sticky">
<Toolbar>
<Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
OpenFood
</Typography>
</Toolbar>
</AppBar>
<Box sx={{ flexGrow: 1, pt: 2 }}>
<Container maxWidth="sm">
<DefaultNavbar />
<Box sx={{ p: 2 }}>{children}</Box>
</Container>
</Box>
</Box>
</Styling>
);