Add traffic info button

This commit is contained in:
André Wahlberg 2020-11-24 09:47:09 +01:00
parent 9a8c9756a2
commit 83cdfb3959
4 changed files with 26 additions and 0 deletions

View File

@ -10,6 +10,7 @@ import BottomMenu from './components/BottomMenu.js'
import Tickets from './components/pages/Tickets.js'; import Tickets from './components/pages/Tickets.js';
import TicketsBuy from './components/pages/TicketsBuy.js'; import TicketsBuy from './components/pages/TicketsBuy.js';
import Travel from './components/pages/Travel.js'; import Travel from './components/pages/Travel.js';
import TrafficInfo from './components/pages/TrafficInfo.js';
class App extends Component { class App extends Component {
render() { render() {
@ -22,6 +23,7 @@ class App extends Component {
<Route path="/tickets" exact component={Tickets} /> <Route path="/tickets" exact component={Tickets} />
<Route path="/ticketsBuy" exact component={TicketsBuy} /> <Route path="/ticketsBuy" exact component={TicketsBuy} />
<Route path="/travel" exact component={Travel} /> <Route path="/travel" exact component={Travel} />
<Route path="/traffic" exact component={TrafficInfo} />
<BottomMenu /> <BottomMenu />
</div> </div>

View File

@ -7,6 +7,7 @@ import './css/BottomMenu.css';
import ticketsIcon from '../img/tickets.svg'; import ticketsIcon from '../img/tickets.svg';
import ticketsBuyIcon from '../img/tickets+.svg'; import ticketsBuyIcon from '../img/tickets+.svg';
import travelIcon from '../img/tram.svg'; import travelIcon from '../img/tram.svg';
import trafficIcon from '../img/traffic.svg';
class BottomMenu extends Component { class BottomMenu extends Component {
render() { render() {
@ -23,6 +24,10 @@ class BottomMenu extends Component {
<Link to="/travel"> <Link to="/travel">
<BottomMenuButton label="Reseplanering" icon={travelIcon}/> <BottomMenuButton label="Reseplanering" icon={travelIcon}/>
</Link> </Link>
<Link to="/traffic">
<BottomMenuButton label="Trafikinfo" icon={trafficIcon}/>
</Link>
</div> </div>
); );
} }

View File

@ -0,0 +1,17 @@
import React, { Component } from 'react';
import Header from '../Header.js'
import MainArea from '../MainArea.js'
class TrafficInfo extends Component {
render() {
return (
<>
<Header title="Trafikinfo" />
<MainArea />
</>
);
}
}
export default TrafficInfo;

2
src/img/traffic.svg Normal file
View File

@ -0,0 +1,2 @@
<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><g><path d="M256,184a56,56,0,1,0,56,56A56.063,56.063,0,0,0,256,184Zm0,96a40,40,0,1,1,40-40A40.045,40.045,0,0,1,256,280Z"/><path d="M256,56a56,56,0,1,0,56,56A56.063,56.063,0,0,0,256,56Zm0,96a40,40,0,1,1,40-40A40.045,40.045,0,0,1,256,152Z"/><path d="M256,312a56,56,0,1,0,56,56A56.063,56.063,0,0,0,256,312Zm0,96a40,40,0,1,1,40-40A40.045,40.045,0,0,1,256,408Z"/><path d="M368,304a8,8,0,0,0,7.89-6.68l16-96A8.007,8.007,0,0,0,384,192H352V168h16a8,8,0,0,0,7.89-6.68l16-96A8.007,8.007,0,0,0,384,56H352V40a8,8,0,0,0-8-8H319.71A28.043,28.043,0,0,0,292,8H220a28.043,28.043,0,0,0-27.71,24H168a8,8,0,0,0-8,8V56H128a8.007,8.007,0,0,0-7.89,9.32l16,96A8,8,0,0,0,144,168h16v24H128a8.007,8.007,0,0,0-7.89,9.32l16,96A8,8,0,0,0,144,304h16v16H128a8.007,8.007,0,0,0-7.89,9.32l16,96A8,8,0,0,0,144,432h16v8a8,8,0,0,0,8,8h48v48a8,8,0,0,0,8,8h64a8,8,0,0,0,8-8V448h48a8,8,0,0,0,8-8v-8h16a8,8,0,0,0,7.89-6.68l16-96A8.007,8.007,0,0,0,384,320H352V304ZM352,72h22.56l-13.34,80H352Zm0,136h22.56l-13.34,80H352ZM160,416h-9.22l-13.34-80H160Zm0-128h-9.22l-13.34-80H160Zm0-136h-9.22L137.44,72H160ZM220,24h72a12.014,12.014,0,0,1,11.31,8H208.69A12.014,12.014,0,0,1,220,24Zm60,464H232V448h48Zm56-56H176V48H336Zm38.56-96-13.34,80H352V336Z"/></g></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB