Another structure..

client/components/NavBar.js

@@ -28,8 +28,8 @@ const NavBar = () => {
           <div className="navbar-menu">
             <div className="navbar-start">
               <Link className="navbar-item" to='/'>Home</Link>
-              <Link className="navbar-item" to='/upload'>Upload</Link>
-              <Link className="navbar-item" to='/students'>Check Students</Link>
+              <Link className="navbar-item" to='/exams'>Exams</Link>
+              <Link className="navbar-item" to='/students'>Students</Link>
               <Link className="navbar-item" to='/grade'><strong><i>Grade</i></strong></Link>  
             </div>
 

client/index.js

@@ -18,20 +18,20 @@ const Home = Loadable({
   loader: () => import('./views/Home'),
   loading: Loading,
 });
-const Grade = Loadable({
-  loader: () => import('./views/Grade'),
+const Exams = Loadable({
+  loader: () => import('./views/Exams'),
   loading: Loading,
 });
-const Upload = Loadable({
-  loader: () => import('./views/Upload'),
+const Students = Loadable({
+  loader: () => import('./views/Students'),
   loading: Loading,
 });
-const CheckStudents = Loadable({
-  loader: () => import('./views/CheckStudents'),
+const Grade = Loadable({
+  loader: () => import('./views/Grade'),
   loading: Loading,
 });
-const ManageGraders = Loadable({
-  loader: () => import('./views/ManageGraders'),
+const Graders = Loadable({
+  loader: () => import('./views/Graders'),
   loading: Loading,
 });
 const Reset = Loadable({
@@ -44,10 +44,10 @@ ReactDOM.render((
   <Router>
     <Switch>
      	<Route exact path="/" component={Home} />
+      <Route path="/exams" component={Exams} />
+      <Route path="/students" component={Students} />
       <Route path="/grade" component={Grade} />
-     	<Route path="/upload" component={Upload} />
-      <Route path="/students" component={CheckStudents} />
-      <Route path="/graders" component={ManageGraders} />
+      <Route path="/graders" component={Graders} />
       <Route path="/reset" component={Reset} />
     </Switch>
   </Router>

client/views/Upload.js → client/views/Exams.js

@@ -9,7 +9,7 @@ const Upload = () => {
 
         <NavBar />
         
-        <Hero title='Upload' subtitle='Omnomnomnom data!' />
+        <Hero title='Exams' subtitle="Omnomnomnom PDF's!" />
 
         <section className="section">
 
@@ -37,6 +37,22 @@ const Upload = () => {
                       </span>
                     </label>
                   </div>
+                  <div className="file">
+                    <label className="file-label">
+                      <input className="file-input" type="file" name="resume" />
+                      <span className="file-cta">
+                        <span className="file-icon">
+                          <i className="fa fa-upload"></i>
+                        </span>
+                        <span className="file-label">
+                          Choose a file…
+                        </span>
+                      </span>
+                      <span className="file-name">
+                        exam_metadata.csv
+                      </span>
+                    </label>
+                  </div>
                 </div>
               </div>
               <div className="level-item has-text-centered">

client/views/ManageGraders.js → client/views/Graders.js

@@ -3,13 +3,13 @@ import NavBar from '../components/NavBar';
 import Hero from '../components/Hero';
 import Footer from '../components/Footer';
 
-const AddGraders = () => {
+const Graders = () => {
   return (
       <div>
 
         <NavBar />
 
-        <Hero title='Add Graders' subtitle='Many hands make light work' />
+        <Hero title='Manage Graders' subtitle='Many hands make light work' />
         
         <section className="section">
 
@@ -20,19 +20,6 @@ const AddGraders = () => {
             
             <hr />
 
-              
-            <div class="field has-addons">
-              <div class="select">
-                <select>
-                  <option>Henk de Vries</option>
-                  <option>Jan Janssen</option>
-                </select>
-              </div>
-              <div class="control">
-                <a class="button is-danger">Delete</a>
-              </div>
-            </div>
-
             <div class="field has-addons">
               <div class="control">
                 <input class="input" type="text" placeholder="Add someone" />
@@ -44,12 +31,19 @@ const AddGraders = () => {
               </div>
             </div>
 
-
+            <div class="field has-addons">
+              <div class="select">
+                <select>
+                  <option>Henk de Vries</option>
+                  <option>Jan Janssen</option>
+                </select>
+              </div>
+              <div class="control">
+                <a class="button is-danger">Delete</a>
+              </div>
+            </div>
             
-
-
           </div>
-
         </section>
 
         <Footer />
@@ -58,4 +52,4 @@ const AddGraders = () => {
   )
 }
 
-export default AddGraders;
+export default Graders;

client/views/Reset.js

@@ -26,16 +26,16 @@ const Reset = () => {
                   <button class="button is-danger">Everything</button>
                 </div>
                 <div class="level-item control">
-                  <button class="button is-warning">People</button>
+                  <button class="button is-warning">Exams</button>
                 </div>
                 <div class="level-item control">
-                  <button class="button is-warning">Exam</button>
+                  <button class="button is-warning">Students</button>
                 </div>
                 <div class="level-item control">
-                  <button class="button is-warning">Student validation</button>
+                  <button class="button is-warning">Grading</button>
                 </div>
                 <div class="level-item control">
-                  <button class="button is-warning">Gradeing</button>
+                  <button class="button is-warning">Graders</button>
                 </div>
             </nav>
           </div>