This commit is contained in:
sunny 2017-07-19 17:20:17 +09:00
parent a08b221743
commit c9464b262d
4 changed files with 30 additions and 22 deletions

View File

@ -1,5 +1,5 @@
import * as React from 'react';
import { Container } from 'semantic-ui-react';
import { Container, Divider } from 'semantic-ui-react';
import { TopBar } from '../TopBar';
import { LogoBar } from './LogoBar';
import { TitleBar } from './TitleBar';
@ -16,7 +16,9 @@ export class Header extends React.Component<any, any> {
return (
<Container fluid>
<LogoBar />
<Divider />
<TitleBar />
<Divider />
</Container>
// <TopBar onSidebar={this.props.onSidebar}/>
);

View File

@ -28,7 +28,7 @@ export class Layout extends React.Component<any, any> {
<Container fluid>
<Grid>
<Grid.Row>
<Grid.Column width='2'>
<Grid.Column width='2' style={{margin:'0px'}}>
<LeftMenu />
</Grid.Column>
<Grid.Column width='14'>

View File

@ -24,15 +24,17 @@ export class LeftMenu extends React.Component<any, any> {
<Segment inverted className='fullHeight'>
<Menu inverted secondary vertical fluid icon='labeled' >
<Menu.Item name='User' >
<Menu.Item name='User' href='/' >
<Icon name='user' />
</Menu.Item>
<Menu.Item name='Home' >
<Menu.Item name='Home' href='/' >
<Icon name='home' />
Home
</Menu.Item>
<Menu.Item name='Monitoring' >
<Menu.Item name='Monitoring' href='/' >
<Icon name='bar graph' />
Monitoring
{/*
<Dropdown text='Monitoring' pointing>
<Dropdown.Menu>
<Dropdown.Header>Monitoring</Dropdown.Header>
@ -40,42 +42,45 @@ export class LeftMenu extends React.Component<any, any> {
<Dropdown.Item>Sensors</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
*/}
</Menu.Item>
<Menu.Item name='Infrastructure' >
<Menu.Item name='Infrastructure' href='/' >
<Icon name='sitemap' />
Infrastructure
{/*
<Dropdown text='Infrastructure' >
<Dropdown.Menu>
<Dropdown.Header>Infrastructure</Dropdown.Header>
<Dropdown.Item>Maps</Dropdown.Item>
<Dropdown.Item>Targets</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
*/}
</Menu.Item>
<Menu.Item name='Dashboard' >
<Menu.Item name='Dashboard' href='/' >
<Icon name='industry' />
Dashboard
</Menu.Item>
<Menu.Item name='Metrics' >
<Menu.Item name='Metrics' href='/' >
<Icon name='tasks' />
Metrics
</Menu.Item>
<Menu.Item name='Alerts' >
<Menu.Item name='Alerts' href='/' >
<Icon name='alarm' />
Alerts
</Menu.Item>
<Menu.Item name='History' >
<Menu.Item name='History' href='/' >
<Icon name='book' />
History
</Menu.Item>
<Menu.Item>
<Menu.Item href='/'>
<Icon name='play circle' />
<Dropdown text='Custom'>
<Dropdown.Menu>
@ -91,7 +96,7 @@ export class LeftMenu extends React.Component<any, any> {
</Dropdown.Menu>
</Dropdown>
</Menu.Item>
<Menu.Item name='Settings' >
<Menu.Item name='Settings' href='/' >
<Icon name='setting' />
Settings
</Menu.Item>

View File

@ -28,15 +28,16 @@ export class TitleBar extends React.Component<any, any> {
<Grid>
<Grid.Row>
<Grid.Column width='3'>
<Header as='h3'>Page Title<Header.Subheader>
<Breadcrumb>
<Breadcrumb.Section link>Home</Breadcrumb.Section>
<Breadcrumb.Divider />
<Breadcrumb.Section link>Monitoring</Breadcrumb.Section>
<Breadcrumb.Divider />
<Breadcrumb.Section active>Probes</Breadcrumb.Section>
</Breadcrumb>
</Header.Subheader>
<Header as='h3'>Page Title
<Header.Subheader>
<Breadcrumb size='tiny'>
<Breadcrumb.Section link>Home</Breadcrumb.Section>
<Breadcrumb.Divider />
<Breadcrumb.Section link>Monitoring</Breadcrumb.Section>
<Breadcrumb.Divider />
<Breadcrumb.Section active>Probes</Breadcrumb.Section>
</Breadcrumb>
</Header.Subheader>
</Header>
</Grid.Column>
<Grid.Column width='13'>