overflow_backup_2018_0455/test_web_router
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

sidebar

Browse Source
This commit is contained in:
snoop 2017-07-12 16:59:18 +09:00
parent 2a33063e21
commit c3fb110663
1 changed files with 47 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
src/ts/containers/test/layout/Layout.tsx
View File

@ -1,5 +1,5 @@
import * as React from 'react';
import { Container } from 'semantic-ui-react';
import { Container, Menu, Sidebar, Segment, Icon } from 'semantic-ui-react';
import { Header } from './Header';
import { Footer } from './Footer';
@ -21,15 +21,52 @@ export class Layout extends React.Component<any, any> {
return (
<div>
<br />
<Header />
<Container>
<br />
<Router history={history}>
<Routes />
</Router>
</Container>
<br />
<Footer />
<Sidebar.Pushable as={Segment} >
<Sidebar
as={Menu}
animation='overlay'
width='thin'
direction='right'
visible={this.state.notification_visible}
icon='labeled'
vertical
inverted
>
<Menu.Item name='home'>
<Icon name='home' />
Home
</Menu.Item>
<Menu.Item name='gamepad'>
<Icon name='gamepad' />
Games
</Menu.Item>
<Menu.Item name='camera'>
<Icon name='camera' />
Channels
</Menu.Item>
</Sidebar>
<Sidebar.Pusher >
<Segment basic >
<Header />
<button placeholder='menu' onClick={() => {
this.setState({ notification_visible: !this.state.notification_visible })
}}> sidebar </button>
<Container>
<br />
<Router history={history}>
<Routes />
</Router>
</Container>
<br />
<Footer />
</Segment>
</Sidebar.Pusher>
</Sidebar.Pushable>
</div>
);
}