Implementation for lesson 05-active links

Author: sayinala

lessons/05-active-links/index.css

@@ -0,0 +1,3 @@
+.active {
+    color: green;
+}

lessons/05-active-links/index.html

@@ -3,4 +3,5 @@
 <meta charset=utf-8/>
 <title>My First React Router App</title>
 <div id=app></div>
+<link rel="stylesheet" href="index.css" />
 <script src="bundle.js"></script>

lessons/05-active-links/modules/App.js

@@ -1,14 +1,15 @@
 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>

lessons/05-active-links/modules/NavLink.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import {Link} from 'react-router';
+export default React.createClass({
+    render() {
+        return (
+            <Link {...this.props} activeClassName="active"></Link>
+        )
+    }
+})