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() { function App() {
return ( return (
<>
<Router> <Router>
<NavBar/> <NavBar/>
<Switch> <Switch>
@ -12,6 +13,7 @@ function App() {
<Route path="/posts" component={PostList}/> <Route path="/posts" component={PostList}/>
</Switch> </Switch>
</Router> </Router>
</>
); );
} }

19
src/components/NavBar.js
View file

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