minor ux changes

Author: alexlobera

public/css/main.css

@@ -59,7 +59,7 @@ hr.star-light:after {
 }
 
 header hr.star-light:after {
-  background-color: #774EBD;
+  background-color: #61dafb;
   color: white;
 }
 
@@ -79,7 +79,7 @@ hr.star-primary:after {
 }
 header {
   text-align: center;
-  background: #774EBD;
+  background: #61dafb;
   color: white;
 }
 header .container {

src/components/Header.js

@@ -9,7 +9,7 @@ const Header = (props) => (
                   <div className="intro-text">
                       <span className="name">{props.title}</span>
                       <hr className="star-light" />
-                      <span className="skills">Books to upgrade your web development skills</span>
+                      <span className="skills">Upgrade your web development skills</span>
                   </div>
               </div>
           </div>

src/components/Navigations/Menu.js

@@ -9,7 +9,7 @@ const Menu = ({ isOpen, pageWrapId, toggleMenu}) => (
      toggleMenu={ toggleMenu }
   >
     <h4>
-      Next Courses
+      Next Courses <a onClick={() => toggleMenu() } style={{ cursor: 'pointer' }}><i className="fa fa-close pull-right"></i></a>
     </h4>
     <SideMenuItem link="https://leanjs.com/training/react-redux-graphql-london">London</SideMenuItem>
     <SideMenuItem link="https://leanjs.com/training/react-redux-graphql-london#redux-training-day">Redux Day</SideMenuItem>

src/components/Navigations/Menus/SideMenuItem.js

@@ -1,8 +1,8 @@
 import React from 'react'
 
-const SideMenuItem = ({ children, toggleMenu, link }) => (
+const SideMenuItem = ({ children, link }) => (
   <p>
-    <a href={ link } target="_blank" rel="noopener noreferrer" style={{ cursor: 'pointer' }} onClick={ () => toggleMenu() }>
+    <a href={ link } target="_blank" rel="noopener noreferrer" style={{ cursor: 'pointer' }}>
       { children }
     </a>
   </p>