1 files changed, 26 insertions, 12 deletions
diff --git a/packages/gitbook-plugin-theme-default/src/index.js b/packages/gitbook-plugin-theme-default/src/index.js
index 33ca405..4eed252 100644
--- a/packages/gitbook-plugin-theme-default/src/index.js
+++ b/packages/gitbook-plugin-theme-default/src/index.js
@@ -1,40 +1,54 @@
 const React = require('react');
 const GitBook = require('gitbook-core');
 
-const Sidebar = require('./Sidebar');
-const Page = require('./Page');
-const Toolbar = require('./Toolbar');
+const Sidebar = require('./components/Sidebar');
+const Body = require('./components/Body');
+
+const reduceState = require('./reducers');
 
 let ThemeBody = React.createClass({
     propTypes: {
+        // State
         page:     GitBook.Shapes.Page,
         summary:  GitBook.Shapes.Summary,
+        sidebar:  React.PropTypes.object,
+        // Other props
         children: React.PropTypes.node
     },
 
     render() {
-        const { page, summary, children } = this.props;
+        const { page, summary, children, sidebar } = this.props;
 
         return (
-            <div className="GitBook book">
+            <GitBook.FlexLayout column className="GitBook book">
                 <GitBook.Head
                     title={page.title}
                     titleTemplate="%s - GitBook" />
                 <GitBook.ImportCSS href="gitbook/gitbook-plugin-theme-default/theme.css" />
 
-                <Toolbar />
-                <Sidebar summary={summary} />
-                <Page page={page} />
+                <GitBook.FlexBox>
+                    <GitBook.FlexLayout>
+                        {sidebar.open ? (
+                            <GitBook.FlexBox col={3}>
+                                <Sidebar summary={summary} />
+                            </GitBook.FlexBox>
+                        ) : null}
+                        <GitBook.FlexBox col={9}>
+                            <Body page={page} />
+                        </GitBook.FlexBox>
+                    </GitBook.FlexLayout>
+                </GitBook.FlexBox>
                 {children}
-            </div>
+            </GitBook.FlexLayout>
         );
     }
 });
 
-ThemeBody = GitBook.connect(ThemeBody, ({page, summary}) => {
-    return { page, summary };
+ThemeBody = GitBook.connect(ThemeBody, ({page, summary, sidebar}) => {
+    console.log('connect', sidebar.toJS())
+    return { page, summary, sidebar };
 });
 
 module.exports = GitBook.createPlugin((dispatch, state) => {
     dispatch(GitBook.registerComponent(ThemeBody, { role: 'Body' }));
-});
+}, reduceState);