Asara/sudoscientist-js-frontend
Archived
1
0
Fork 0
Code Issues Pull requests Activity

Fix navbar highlighting

Browse source
This commit is contained in:
Amarpreet Minhas 2019-06-24 21:54:34 -04:00
parent fabf06b8a6
commit c0bf29c329
2 changed files with 12 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/App.js
View file

@ -5,6 +5,7 @@ import PostList from './PostList';
function App() {
return (
<>
<Router>
<NavBar/>
<Switch>
@ -12,6 +13,7 @@ function App() {
<Route path="/posts" component={PostList}/>
</Switch>
</Router>
</>
);
}

19
src/components/NavBar.js
View file

@ -1,17 +1,18 @@
import React, { Component } from 'react';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';
import PostList from './PostList';
import { Link } from 'react-router-dom';
class NavBar extends Component {
render() {
let classes= 'item';
if (this.props.isActive) {
classes += ' active';
}
return (
<div className="ui five item menu">
<img src="https://avatars1.githubusercontent.com/u/2782304" style={{width:"50px",height:"50px"}}/>
<Link to="/" className="item">Home</Link>
<Link to="/users/" className="item">Users</Link>
<Link to="/posts/" className="item">Posts</Link>
<Link to="/about/" className="item">About</Link>
<div className="ui four item menu">
<Link to="/" className='item'>sudoscientist:~#</Link>
<Link to="/users/" className={classes}>Users</Link>
<Link to="/posts/" className={classes}>Posts</Link>
<Link to="/about/" className={classes}>About</Link>
</div>
);
}