import { createStyles, makeStyles } from "@material-ui/core/styles";
const drawerWidth = 240;
export const defaultLayoutStyles = makeStyles((theme) => {
    const drawerTop = theme.spacing(8);
    return createStyles({
        root: {
            display: "flex",
            height: "-webkit-fill-available"
        },
        drawer: {
            whiteSpace: "nowrap",
            [theme.breakpoints.up("sm")]: {
                width: drawerWidth,
                flexShrink: 0
            }
        },
        drawerOpen: {
            width: drawerWidth,
            top: drawerTop,
            borderRight: "none",
            transition: theme.transitions.create("width", {
                easing: theme.transitions.easing.sharp,
                duration: theme.transitions.duration.enteringScreen
            })
        },
        drawerClose: {
            top: drawerTop,
            borderRight: "none",
            transition: theme.transitions.create("width", {
                easing: theme.transitions.easing.sharp,
                duration: theme.transitions.duration.leavingScreen
            }),
            overflowX: "hidden",
            width: theme.spacing(7) + 1,
            [theme.breakpoints.up("sm")]: {
                width: theme.spacing(9) + 1
            }
        },
        hide: {
            display: "none"
        },
        toolbar: theme.mixins.toolbar,
        drawerPaper: {
            width: drawerWidth
        },
        content: {
            background: theme.bunadmin.contentBg,
            flexGrow: 1,
            padding: theme.spacing(4.5)
        },
        contentBox: {
            background: theme.bunadmin.contentBoxBg,
            marginTop: theme.spacing(8)
        },
        // table
        treeDataThHidden: {
            display: "none"
        }
    });
});