fix add missing nav links
refactor into json
This commit is contained in:
@ -1,7 +1,29 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Nav, Navbar, NavItem } from 'react-bootstrap';
|
import { Nav, Navbar, NavItem } from 'react-bootstrap';
|
||||||
|
|
||||||
|
import navLinks from './links.json';
|
||||||
import FCCNavItem from './NavItem.jsx';
|
import FCCNavItem from './NavItem.jsx';
|
||||||
|
|
||||||
|
const fCClogo = 'https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg';
|
||||||
|
const navElements = navLinks.map((navItem, index) => {
|
||||||
|
return (
|
||||||
|
<NavItem
|
||||||
|
eventKey={ index + 1 }
|
||||||
|
href={ navItem.link }>
|
||||||
|
{ navItem.content }
|
||||||
|
</NavItem>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
const logoElement = (
|
||||||
|
<a href='/'>
|
||||||
|
<img
|
||||||
|
alt='learn to code javascript at Free Code Camp logo'
|
||||||
|
className='img-responsive nav-logo'
|
||||||
|
src={ fCClogo } />
|
||||||
|
</a>
|
||||||
|
);
|
||||||
|
|
||||||
export default class extends React.Component {
|
export default class extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
@ -13,15 +35,6 @@ export default class extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
renderBrand() {
|
renderBrand() {
|
||||||
var fCClogo = 'https://s3.amazonaws.com/freecodecamp/freecodecamp_logo.svg';
|
|
||||||
return (
|
|
||||||
<a href='/'>
|
|
||||||
<img
|
|
||||||
alt='learn to code javascript at Free Code Camp logo'
|
|
||||||
className='img-responsive nav-logo'
|
|
||||||
src={ fCClogo } />
|
|
||||||
</a>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
renderSignin() {
|
renderSignin() {
|
||||||
@ -47,7 +60,7 @@ export default class extends React.Component {
|
|||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Navbar
|
<Navbar
|
||||||
brand={ this.renderBrand() }
|
brand={ logoElement }
|
||||||
className='nav-height'
|
className='nav-height'
|
||||||
fixedTop={ true }
|
fixedTop={ true }
|
||||||
toggleNavKey={ 0 }>
|
toggleNavKey={ 0 }>
|
||||||
@ -55,21 +68,7 @@ export default class extends React.Component {
|
|||||||
className='hamburger-dropdown'
|
className='hamburger-dropdown'
|
||||||
eventKey={ 0 }
|
eventKey={ 0 }
|
||||||
right={ true }>
|
right={ true }>
|
||||||
<NavItem
|
{ navElements }
|
||||||
eventKey={ 1 }
|
|
||||||
href='/Challenges'>
|
|
||||||
Challenges
|
|
||||||
</NavItem>
|
|
||||||
<NavItem
|
|
||||||
eventKey={ 1 }
|
|
||||||
href='Chat'>
|
|
||||||
Chat
|
|
||||||
</NavItem>
|
|
||||||
<NavItem
|
|
||||||
eventKey={ 2 }
|
|
||||||
href='/bonfires'>
|
|
||||||
Bonfires
|
|
||||||
</NavItem>
|
|
||||||
{ this.renderSignin() }
|
{ this.renderSignin() }
|
||||||
</Nav>
|
</Nav>
|
||||||
</Navbar>
|
</Navbar>
|
||||||
|
16
common/app/components/Nav/links.json
Normal file
16
common/app/components/Nav/links.json
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
[{
|
||||||
|
"content": "Map",
|
||||||
|
"link": "/map"
|
||||||
|
}, {
|
||||||
|
"content": "Chat",
|
||||||
|
"link": "//gitter.im/FreeCodeCamp/FreeCodeCamp"
|
||||||
|
},{
|
||||||
|
"content": "News",
|
||||||
|
"link": "/news"
|
||||||
|
},{
|
||||||
|
"content": "Guide",
|
||||||
|
"link": "/field-guide"
|
||||||
|
},{
|
||||||
|
"content": "Jobs",
|
||||||
|
"link": "/jobs"
|
||||||
|
}]
|
Reference in New Issue
Block a user