48 lines
1.6 KiB
TypeScript
48 lines
1.6 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="md">
|
|
<BreadCrumbs/>
|
|
|
|
<Box sx={{p: 2, mt: 2}}>{children}</Box>
|
|
</Container>
|
|
</Box>
|
|
</Box>
|
|
</Styling>
|
|
);
|