change a to react-router link

client/components/Nav.js

@@ -65,17 +65,16 @@ function Nav(props) {
                 </p>
               </li>
             );
-          } else {
+          }
           return (
             <li className="nav__item">
               <p className="nav__open">
-                  <a href="http://alpha.editor.p5js.org/p5/sketches">
+                <Link to="/p5js/sketches">
                   Open
-                  </a>
+                </Link>
               </p>
             </li>
           );
-          }
         })()}
         <li className="nav__item">
           <p className="nav__about">

client/images/file.svg

@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="11px" height="12px" viewBox="0 0 7 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 39.1 (31720) - http://www.bohemiancoding.com/sketch -->
+    <title>"K" file icon Copy</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="environment" transform="translate(-25.000000, -103.000000)" fill="#B5B5B5">
+            <g id="&quot;K&quot;-file-icon-Copy-+-styles.css" transform="translate(25.000000, 94.000000)">
+                <path d="M0.2,9.704 L0.2,17 L6.188,17 L6.188,11.72 L4.22,9.704 L0.2,9.704 Z M1.064,10.568 L3.104,10.568 C3.5,10.568 3.776,10.832 3.776,11.12 L3.776,12.008 L4.952,12.008 C5.192,12.008 5.324,12.044 5.324,12.332 L5.324,16.136 L1.064,16.136 L1.064,10.568 Z M1.892,13.316 L4.58,13.316 L4.58,12.992 L1.892,12.992 L1.892,13.316 Z M1.892,14.276 L4.58,14.276 L4.58,13.952 L1.892,13.952 L1.892,14.276 Z M1.892,15.236 L4.58,15.236 L4.58,14.912 L1.892,14.912 L1.892,15.236 Z" id="&quot;K&quot;-file-icon-Copy"></path>
+            </g>
+        </g>
+    </g>
+</svg>