Add mobile menu to overview page

2 files changed, 23 insertions, 3 deletions

diff --git a/packages/website/ts/components/documentation/docs_content_top_bar.tsx b/packages/website/ts/components/documentation/docs_content_top_bar.tsx
index 1db9e794a..9b86c7296 100644
--- a/packages/website/ts/components/documentation/docs_content_top_bar.tsx
+++ b/packages/website/ts/components/documentation/docs_content_top_bar.tsx
@@ -1,4 +1,11 @@
-import { colors } from '@0xproject/react-shared';
+import { DocsInfo, DocsMenu } from '@0xproject/react-docs';
+import {
+    colors,
+    constants as sharedConstants,
+    MenuSubsectionsBySection,
+    NestedSidebarMenu,
+    Styles,
+} from '@0xproject/react-shared';
 import * as _ from 'lodash';
 import Drawer from 'material-ui/Drawer';
 import * as React from 'react';
@@ -12,6 +19,7 @@ import { Translate } from 'ts/utils/translate';
 export interface DocsContentTopBarProps {
     location: Location;
     translate: Translate;
+    menu?: DocsMenu;
 }
 
 interface DocsContentTopBarState {
@@ -143,7 +151,15 @@ export class DocsContentTopBar extends React.Component<DocsContentTopBarProps, D
                 openSecondary={true}
                 onRequestChange={this._onMenuButtonClick.bind(this)}
             >
-                <div className="clearfix">TODO</div>
+                <div className="clearfix pl1">
+                    <NestedSidebarMenu
+                        topLevelMenu={this.props.menu}
+                        menuSubsectionsBySection={{}}
+                        shouldDisplaySectionHeaders={true}
+                        shouldReformatMenuItemNames={false}
+                        onMenuItemClick={this._onMenuButtonClick.bind(this)}
+                    />
+                </div>
             </Drawer>
         );
     }
diff --git a/packages/website/ts/pages/documentation/home.tsx b/packages/website/ts/pages/documentation/home.tsx
index 338230358..009048838 100644
--- a/packages/website/ts/pages/documentation/home.tsx
+++ b/packages/website/ts/pages/documentation/home.tsx
@@ -374,7 +374,11 @@ export class Home extends React.Component<HomeProps, HomeState> {
                         backgroundColor={colors.white}
                     >
                         <Container paddingLeft={mainContentPadding} paddingRight={mainContentPadding}>
-                            <DocsContentTopBar location={this.props.location} translate={this.props.translate} />
+                            <DocsContentTopBar
+                                location={this.props.location}
+                                translate={this.props.translate}
+                                menu={topLevelMenu}
+                            />
                         </Container>
                         <div
                             id={sharedConstants.SCROLL_CONTAINER_ID}