diff --git a/src/components/Layout/Layout.js b/src/components/Layout/Layout.js
index aa96755..0dfe4ac 100644
--- a/src/components/Layout/Layout.js
+++ b/src/components/Layout/Layout.js
@@ -1,18 +1,31 @@
-import React from 'react';
+import React, { Component } from 'react';
import Aux from '../../hoc/Auxiliary';
import classes from './Layout.css';
import Toolbar from '../Navigation/Toolbar/Toolbar';
import SideDrawer from '../Navigation/SideDrawer/SideDrawer';
-const layout = (props) => (
-
-
-
-
- {props.children}
-
-
-)
+class Layout extends Component {
+ state = {
+ showSideDrawer: true
+ }
-export default layout;
\ No newline at end of file
+ sideDrawerClosedHandler = () => {
+ this.setState({showSideDrawer: false});
+ }
+
+ render() {
+ return (
+
+
+
+
+ {this.state.children}
+
+
+
+ );
+ };
+}
+
+export default Layout;
\ No newline at end of file
diff --git a/src/components/Navigation/SideDrawer/SideDrawer.js b/src/components/Navigation/SideDrawer/SideDrawer.js
index eace56f..518789d 100644
--- a/src/components/Navigation/SideDrawer/SideDrawer.js
+++ b/src/components/Navigation/SideDrawer/SideDrawer.js
@@ -3,17 +3,28 @@ import React from 'react';
import classes from './SideDrawer.css';
import Logo from '../../Logo/Logo';
import NavigationItems from '../NavigationItems/NavigationItems';
+import Aux from '../../../hoc/Auxiliary';
+import Backdrop from '../../UI/Backdrop/Backdrop';
+
+const sideDrawer = (props) => {
+ let attachedClasses = [classes.SideDrawer, classes.Close];
+ if (props.open){
+ attachedClasses = [classes.SideDrawer, classes.Open];
+ }
-const sideDrawer = () => {
return (
-