Add tool page
This commit is contained in:
+32
-25
@@ -1,6 +1,7 @@
|
||||
import React, { Component } from 'react';
|
||||
import Categories from './Categories';
|
||||
import Category from './Category';
|
||||
import Tool from './Tool';
|
||||
import { Container, Dropdown, Header, Icon, Item, Menu, Segment, Input } from 'semantic-ui-react';
|
||||
import { Link, Route } from 'react-router-dom';
|
||||
|
||||
@@ -31,7 +32,7 @@ const fakeData = {
|
||||
{
|
||||
name: "Metalshop",
|
||||
slug: "metalshop",
|
||||
info: "Some info about the metalshop",
|
||||
info: "Some info about the metalshop.",
|
||||
photo: "https://i.imgur.com/A2L2ACY.jpg",
|
||||
tools: [
|
||||
{
|
||||
@@ -39,49 +40,55 @@ const fakeData = {
|
||||
name: "Tormach CNC",
|
||||
photo: "http://wiki.protospace.ca/images/thumb/c/cf/49.jpg/320px-49.jpg",
|
||||
notes: "Must complete Shop Safety, Lathe Training, 3D CAD Training, CAM Training, 1 on 1 Project.",
|
||||
wikiID: 49,
|
||||
wikiId: 49,
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: "Powerfist Bench Grinder",
|
||||
photo: "http://wiki.protospace.ca/images/thumb/c/cd/39.jpg/298px-39.jpg",
|
||||
notes: "A bench grinder is for grinding steels or deburring steel or aluminum (if fitted with a wire wheel).",
|
||||
wikiID: 39,
|
||||
wikiId: 39,
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
user: {
|
||||
authorizedTools: [1, 2],
|
||||
},
|
||||
};
|
||||
|
||||
class App extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Menu fixed='top' borderless inverted>
|
||||
<Menu.Item>
|
||||
<Icon name='bars' size='big' />
|
||||
</Menu.Item>
|
||||
<Menu.Item as={Link} to='/'>
|
||||
<Icon name='home' size='big' />
|
||||
</Menu.Item>
|
||||
<Menu.Menu position='right'>
|
||||
<Menu.Item position='right'>
|
||||
<Input transparent inverted placeholder='Search...' icon='search' />
|
||||
</Menu.Item>
|
||||
</Menu.Menu>
|
||||
</Menu>
|
||||
<div style={{height: '54px', display: 'inline-block'}} />
|
||||
<div>
|
||||
<Menu fixed='top' borderless inverted>
|
||||
<Menu.Item>
|
||||
<Icon name='bars' size='big' />
|
||||
</Menu.Item>
|
||||
<Menu.Item as={Link} to='/'>
|
||||
<Icon name='home' size='big' />
|
||||
</Menu.Item>
|
||||
<Menu.Menu position='right'>
|
||||
<Menu.Item position='right'>
|
||||
<Input transparent inverted placeholder='Search...' icon='search' />
|
||||
</Menu.Item>
|
||||
</Menu.Menu>
|
||||
</Menu>
|
||||
<div style={{height: '70px', display: 'inline-block'}} />
|
||||
|
||||
<Route exact path='/' render={props =>
|
||||
<Categories {...props} data={fakeData} />
|
||||
} />
|
||||
<Route exact path='/' render={props =>
|
||||
<Categories {...props} data={fakeData} />
|
||||
} />
|
||||
|
||||
<Route exact path='/:category' render={props =>
|
||||
<Category {...props} data={fakeData} />
|
||||
} />
|
||||
<Route exact path='/:category' render={props =>
|
||||
<Category {...props} data={fakeData} />
|
||||
} />
|
||||
|
||||
</div>
|
||||
<Route exact path='/:category/:id' render={props =>
|
||||
<Tool {...props} data={fakeData} />
|
||||
} />
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user