@@ -34,6 +34,7 @@ class Layout extends React.PureComponent {
34
34
appBarPosition : 'default' ,
35
35
stickyFooter : false ,
36
36
drawerOpen : false ,
37
+ drawerUnder : false ,
37
38
} ;
38
39
39
40
handleDrawerClose = ( ) => {
@@ -53,33 +54,51 @@ class Layout extends React.PureComponent {
53
54
classes : defaultClasses ,
54
55
overrideClasses,
55
56
children,
56
- appBarPosition,
57
- stickyFooter,
58
- footerContent,
59
57
appBarContent,
58
+ appBarPosition,
59
+ appBarProps,
60
60
drawerContent,
61
61
drawerOpen,
62
- appBarProps,
62
+ drawerType,
63
+ drawerUnder,
63
64
drawerProps,
65
+ footerContent,
66
+ stickyFooter,
64
67
footerProps,
65
68
} = this . props ;
66
69
70
+ // TODO change the way to overrideClasses
71
+ // use classes insted of overrideClasses as material-ui
67
72
const classes = { ...defaultClasses , ...overrideClasses } ;
68
73
69
74
const mainClassnames = classNames (
70
75
classes . main ,
71
76
{ [ `${ classes . mainFixedAppBar } ` ] : appBarPosition === 'fixed' } ,
72
77
{ [ `${ classes . mainStickyFooter } ` ] : stickyFooter } ,
73
78
) ;
79
+
80
+ const appBarShift =
81
+ drawerOpen && ! drawerUnder && ( drawerType === 'permanent' || drawerType === 'persistent' ) ;
82
+ console . log ( 'appBarShift' , appBarShift ) ;
83
+
84
+ const appBarClassnames = classNames ( classes . appBar , {
85
+ [ `${ classes . appBarShift } ` ] : appBarShift ,
86
+ } ) ;
74
87
return (
75
88
< div className = { classes . layout } >
76
- < AppBar { ...appBarProps } position = { appBarPosition } onIconClick = { this . toggleDrawer } >
89
+ < AppBar
90
+ position = { appBarPosition }
91
+ onIconClick = { this . toggleDrawer }
92
+ className = { appBarClassnames }
93
+ { ...appBarProps }
94
+ >
77
95
{ appBarContent }
78
96
</ AppBar >
79
97
{ drawerContent ? (
80
98
< Drawer
81
99
open = { drawerOpen }
82
100
onRequestClose = { this . handleDrawerClose }
101
+ type = { drawerType }
83
102
classes = { { paper : classes . drawerPaper } }
84
103
{ ...drawerProps }
85
104
>
0 commit comments