Getting rid of GitHub ribbon in exchange for a simple link

src/sass/main.scss

@@ -68,7 +68,26 @@ header {
   }
 
   nav {
+    overflow: hidden;
+
+    ul {
+      @include inline-block-list;
+      display: inline-block;
+    }
+
+    a {
       @include adjust-font-size-to($base-font-size, 2);
+      @include unstyled-link;
+    }
+
+    .source {
+      float: right;
+
+      img {
+        vertical-align: middle;
+        margin-right: rhythm(1/4);
+      }
+    }
   }
 }
 

template.html

@@ -22,7 +22,15 @@
         <span>You thought you only had two problems&hellip;</span>
       </div>
 
-      <nav></nav>
+      <nav>
+        <!--<ul>
+          <li><a href="#">Example</a></li>
+          <li><a href="#">Example</a></li>
+        </ul>-->
+        <a class="source" href="https://github.com/javallone/regexper">
+          <img src="/images/GitHub-Mark-32px.png" />Source on GitHub
+        </a>
+      </nav>
     </header>
 
     <section id="content">
@@ -39,10 +47,6 @@
       </ul>
     </footer>
 
-    <a href="https://github.com/javallone/regexper">
-      <img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub">
-    </a>
-
     <script src="/js/main.js"></script>
   </body>
 </html>