TOC and style improvements

Author: egardner

app/app.scss

@@ -1,5 +1,8 @@
 $family-primary: 'Helvetica Neue', 'Lucida Grande', 'Segoe UI', Ubuntu, Cantarell, sans-serif;
 $super-color: #ffca29;
+$link-color: #00d1b2;
+$link-hover: darken($link-color, 0.5);
+
 @import '~bulma/bulma.sass';
 
 .input {

app/components/Reader/Reader.scss

@@ -4,6 +4,7 @@ $toc-menu-width: 300px;
 
 .reader__container {
   background-color: #fcfcfc;
+  padding: 25px;
 }
 
 .reader__controls {
@@ -18,12 +19,10 @@ $toc-menu-width: 300px;
 .reader__toc {
   background-color: $dark-gray;
   color: #fff;
-  display: flex;
-  flex-direction: column;
   height: 100vh;
-  justify-content: center;
   -webkit-overflow-scrolling: touch;
   overflow-y: auto;
+  padding: $base-spacing $small-spacing;
   position: fixed;
   top: 0;
   left: 0;
@@ -35,4 +34,9 @@ $toc-menu-width: 300px;
   z-index: 600;
 
   &.is-visible { transform: translateX(0%); }
+
+  &__item {
+    a {}
+    a:hover { color: #fff; }
+  }
 }

app/components/Reader/index.js

@@ -37,17 +37,23 @@ class Reader extends Component {
     return (
       <div className="reader__container">
         <div id="toc-nav" className="reader__toc">
-          <div>
+          <ul>
+            <h2>Table of Contents</h2>
             {
               this.state.nav.map((item, index) =>
-                <a key={`navitem_${index}`}
-                   className="nav-item"
-                   onClick={() => { this._onNavClick(item) }}>
-                  {item.label}
-                </a>
+                <li>
+                  <a key={`navitem_${index}`}
+                     className="reader__toc__item"
+                     onClick={() => {
+                         this._onNavClick(item)
+                         this.tocToggle()
+                       }}>
+                    {item.label}
+                  </a>
+                </li>
               )
             }
-          </div>
+          </ul>
         </div>
         <nav className="nav is-fixed">
           <div className="nav-left">