                 z-index:0;
             }'
         style =
-            height   : '100vh'
-            width    : '100vw'
-            overflow : 'auto'
+            height        : '100vh'
+            width         : '100vw'
+            overflow      : 'auto'
+            display       : 'flex'
+            flexDirection : 'column'
 
         <div ref="page" style={style}>
-            <Sidebar
-                sidebar   = {@render_right_menu()}
-                open      = {@state.show_right_menu}
-                onSetOpen = {(open)=>@setState(show_right_menu:open)}
-                pullRight = {true}
-                shadow    = {false}
-                touch     = {false}
-                styles    = {content:{display:'flex', flexDirection:'column'}}
-            >
-                <style>{page_style}</style>
-                <style>{ProjectsNav.dropdown_nav_page_styles}</style>
-                {<FileUsePageWrapper /> if @props.show_file_use}
-                {<Support actions={@actions('support')} /> if @props.show}
-                {<ConnectionInfo ping={@props.ping} status={@props.connection_status} avgping={@props.avgping} actions={@actions('page')} /> if @props.show_connection}
-                {<VersionWarning new_version={@props.new_version} /> if @props.new_version?}
-                {<CookieWarning /> if @props.cookie_warning}
-                {<LocalStorageWarning /> if @props.local_storage_warning}
-                {<Navbar id="smc-top-bar" style={margin:'0px'}>
-                    {@render_projects_button()}
-                    <ProjectsNav dropdown={true} />
-                    {@render_right_menu_button()}
-                </Navbar> if not @props.fullscreen}
-                {# Children must define their own padding from navbar and screen borders}
-                <ActiveAppContent active_top_tab={@props.active_top_tab} render_small={true}/>
-            </Sidebar>
+            <style>{page_style}</style>
+            <style>{ProjectsNav.dropdown_nav_page_styles}</style>
+            {<FileUsePageWrapper /> if @props.show_file_use}
+            {<Support actions={@actions('support')} /> if @props.show}
+            {<ConnectionInfo ping={@props.ping} status={@props.connection_status} avgping={@props.avgping} actions={@actions('page')} /> if @props.show_connection}
+            {<VersionWarning new_version={@props.new_version} /> if @props.new_version?}
+            {<CookieWarning /> if @props.cookie_warning}
+            {<LocalStorageWarning /> if @props.local_storage_warning}
+            {<Navbar id="smc-top-bar" style={margin:'0px'}>
+                {@render_projects_button()}
+                <ProjectsNav dropdown={true} />
+                {@render_menu_button()}
+            </Navbar> if not @props.fullscreen}
+            {@render_menu() if @state.show_menu}
+            {# Children must define their own padding from navbar and screen borders}
+            <ActiveAppContent active_top_tab={@props.active_top_tab} render_small={true}/>
         </div>
 
 page =

            </NavItem>
        </Nav>

    render_right_menu_button: ->
        <Nav style={margin:'0', padding:'15px', paddingRight:'25px', fontSize:'20px', float:'right'}
            onClick={()=>@setState(show_right_menu: true)}
        >
            <NavItem>
                <Icon name="bars"/>
            </NavItem>
        </Nav>

    close_right_menu: ->
        @setState(show_right_menu:false)

    render_right_menu: ->
        # HACK: This is the dumbest hack ever.
        # We should use a better sidemenu in the future.
        if not @state.show_right_menu
            return <div> </div>

        <div style={width:'40vw', height:'100vw', backgroundColor:'white'}>
            <Nav stacked>
                <NavTab
                    name           = 'account'
                    label          = {@account_name()}
                    icon           = 'cog'
                    actions        = {@actions('page')}
                    active_top_tab = {@props.active_top_tab}
                    on_click       = {@close_right_menu}
                    style          = {width:'100%'}
                />
                <NavTab
                    on_click       = {@close_right_menu}
                    name           = 'about'
                    label          = 'About'
                    icon           = 'question-circle'

{React, ReactDOM, rclass, redux, rtypes, Redux} = require('./smc-react')
{Button, Navbar, Nav, NavItem, MenuItem} = require('react-bootstrap')
{Loading, Icon, Tip} = require('./r_misc')

# SMC Pages
