56 lines
1.3 KiB
TypeScript
56 lines
1.3 KiB
TypeScript
import React, { FC } from "react";
|
|
import {
|
|
AppBar,
|
|
Box,
|
|
Button,
|
|
Container,
|
|
Link as MuiLink,
|
|
Toolbar,
|
|
Typography,
|
|
} from "@mui/material";
|
|
import { Styling } from "../general/styling";
|
|
import { BreadCrumbs } from "./breadCrumbs";
|
|
import Link from "next/link";
|
|
|
|
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>
|
|
<Box sx={{ display: "flex", gap: 2 }}>
|
|
<Link href="/auth/login" passHref>
|
|
<MuiLink>
|
|
<Button>Login</Button>
|
|
</MuiLink>
|
|
</Link>
|
|
<Link href="/auth/sign-up" passHref>
|
|
<MuiLink>
|
|
<Button>Sign up</Button>
|
|
</MuiLink>
|
|
</Link>
|
|
</Box>
|
|
</Toolbar>
|
|
</AppBar>
|
|
<Box sx={{ flexGrow: 1, pt: 2 }}>
|
|
<Container maxWidth="sm">
|
|
<BreadCrumbs />
|
|
|
|
<Box sx={{ p: 2 }}>{children}</Box>
|
|
</Container>
|
|
</Box>
|
|
</Box>
|
|
</Styling>
|
|
);
|