import {SideNav} from "../../components/navigation/SideNav";
import Box from "@mui/material/Box";
import {MainNav} from "../../components/navigation/MainNav";
import Container from "@mui/material/Container";

export function UserLayout({children}) {
    return (
        <Box
            sx={{
                bgcolor: 'var(--mui-palette-background-default)',
                display: 'flex',
                flexDirection: 'column',
                position: 'relative',
                minHeight: '100%',
            }}
        >
            <SideNav/>
            <Box sx={{
                display: 'flex',
                flex: '1 1 auto',
                flexDirection: 'column',
                pl: {xl: 'var(--SideNav-width)'}
            }}>
                <MainNav/>
                <Container maxWidth="xl" sx={{py: '16px'}}>
                    {children}
                </Container>
            </Box>
        </Box>
    )
}