Lesson 05 Final

ryanflorence · ryanflorence · commit 82cc8a689780 · 2016-02-09T22:58:57.000-08:00
diff --git a/index.css b/index.css
@@ -0,0 +1,4 @@
+.active {
+  color: green;
+}
+
diff --git a/index.html b/index.html
@@ -2,6 +2,7 @@
 <html>
 <meta charset=utf-8/>
 <title>My First React Router App</title>
+<link rel=stylesheet href=index.css>
 <div id=app></div>
 <script src="bundle.js"></script>
 
diff --git a/modules/App.js b/modules/App.js
@@ -1,14 +1,14 @@
 import React from 'react'
-import { Link } from 'react-router'
+import NavLink from './NavLink'
 
 export default React.createClass({
   render() {
     return (
       <div>
         <h1>React Router Tutorial</h1>
         <ul role="nav">
-          <li><Link to="/about">About</Link></li>
-          <li><Link to="/repos">Repos</Link></li>
+          <li><NavLink to="/about">About</NavLink></li>
+          <li><NavLink to="/repos">Repos</NavLink></li>
         </ul>
         {this.props.children}
       </div>
diff --git a/modules/NavLink.js b/modules/NavLink.js
@@ -0,0 +1,10 @@
+// modules/NavLink.js
+import React from 'react'
+import { Link } from 'react-router'
+
+export default React.createClass({
+  render() {
+    return <Link {...this.props} activeClassName="active"/>
+  }
+})
+

-Original file line number
+Diff line change
@@ @@ -0,0 +1,4 @@ @@
 +.active {
 +  color: green;
 +}
++