tools/src/App.js

90 lines
2.6 KiB
JavaScript
Raw Normal View History

import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';
import {
Collapse,
Navbar,
NavbarToggler,
NavbarBrand,
Nav,
UncontrolledDropdown,
DropdownToggle,
DropdownMenu,
DropdownItem,
} from 'reactstrap';
import Home from './components/Home';
import Wheels from './components/Wheels';
import Gearbox from './components/Gearbox';
import Resistor from './components/Resistor';
import 'bootstrap/dist/css/bootstrap.min.css';
import './App.css';
class App extends Component {
constructor(props) {
super(props);
this.toggle = this.toggle.bind(this);
this.state = {
isOpen: false,
};
}
toggle() {
this.setState({
isOpen: !this.state.isOpen,
});
}
render() {
return (
<Router>
<div className="App">
<Navbar color="dark" dark expand="md">
2021-03-21 18:42:57 +01:00
<NavbarBrand href="/">Car tools</NavbarBrand>
<NavbarToggler onClick={this.toggle} />
<Collapse isOpen={this.state.isOpen} navbar>
<Nav className="ml-auto" navbar>
<UncontrolledDropdown nav inNavbar>
<DropdownToggle nav caret>
Mécanique
</DropdownToggle>
<DropdownMenu right>
<DropdownItem tag={Link} to="/Wheels">
Roues
</DropdownItem>
<DropdownItem tag={Link} to="/Gearbox">
Boîte de vitesse
</DropdownItem>
2021-03-21 18:42:57 +01:00
<DropdownItem tag={Link} to="/Spokes">
Calcul longueur rayons
</DropdownItem>
</DropdownMenu>
</UncontrolledDropdown>
<UncontrolledDropdown nav inNavbar>
<DropdownToggle nav caret>
Électronique
</DropdownToggle>
<DropdownMenu right>
<DropdownItem tag={Link} to="/Resistor">
Résistance
</DropdownItem>
</DropdownMenu>
</UncontrolledDropdown>
</Nav>
</Collapse>
</Navbar>
<div>
<Route exact path="/" component={Home} />
<Route exact path="/wheels" component={Wheels} />
<Route exact path="/Gearbox" component={Gearbox} />
<Route exact path="/Resistor" component={Resistor} />
2021-03-21 18:42:57 +01:00
<Route exact path="/Spokes" component={Wheels} />
</div>
</div>
</Router>
);
}
}
export default App;