28 lines
840 B
TypeScript
28 lines
840 B
TypeScript
import { styled } from '@mui/material';
|
|
import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@mui/material/AppBar';
|
|
|
|
interface AppBarProps extends MuiAppBarProps {
|
|
open?: boolean
|
|
}
|
|
|
|
const drawerWidth = 240;
|
|
|
|
const AppBar = styled(MuiAppBar, {
|
|
shouldForwardProp: (prop) => prop !== 'open',
|
|
})<AppBarProps>(({ theme, open }) => ({
|
|
zIndex: theme.zIndex.drawer + 1,
|
|
transition: theme.transitions.create(['width', 'margin'], {
|
|
easing: theme.transitions.easing.sharp,
|
|
duration: theme.transitions.duration.leavingScreen,
|
|
}),
|
|
...(open && {
|
|
marginLeft: drawerWidth,
|
|
width: `calc(100% - ${drawerWidth}px)`,
|
|
transition: theme.transitions.create(['width', 'margin'], {
|
|
easing: theme.transitions.easing.sharp,
|
|
duration: theme.transitions.duration.enteringScreen,
|
|
}),
|
|
}),
|
|
}));
|
|
|
|
export default AppBar |