Make menu fixed on larger viewports (#100)

Author: bjorn3

front/app/styles/app.css

@@ -15,3 +15,39 @@
     margin: 0.2%;
     overflow: hidden;
 }
+
+nav {
+    position: fixed !important;
+    top: 0px;
+    left: 0px;
+    right: 0px;
+    
+    background: white;
+    z-index: 1000;
+    
+    font-size: 2.4rem;
+    line-height: 1.5;
+    letter-spacing: -.05rem;
+}
+
+nav h4 {
+    margin-bottom: 0px;
+}
+
+#title{
+    margin-bottom: 0px;
+}
+
+div.container {
+    margin-top: 150px;
+}
+
+@media all and (max-width: 680px) {
+    nav {
+        position: unset !important;
+    }
+    
+    div.container {
+        margin-top: 0px;
+    }
+}

front/app/templates/application.hbs

@@ -1,34 +1,32 @@
 <a href="https://github.com/dikaiosune/rust-dashboard" target="_blank">
-  <img style="position: absolute; top: 0; left: 0; border: 0;"
+  <img style="position: absolute; top: 0; left: 0; border: 0; z-index: 2000"
        alt="Fork me on GitHub"
        src="https://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png">
 </a>
 
-<div class="container">
-
+<nav class="container">
     <h2 id="title">Rust Language Project Metrics</h2>
+    
+    {{#link-to 'summary'}}Home{{/link-to}}
+    &bull;
+    {{#link-to 'fcp'}}FCPs{{/link-to}}
+    &bull;
+    {{#link-to 'releases'}}Nightlies{{/link-to}}
+    &bull;
+    {{#link-to 'issues'}}Issues{{/link-to}}
+    &bull;
+    {{#link-to 'prs'}}Pull Requests{{/link-to}}
+    &bull;
+    {{#link-to 'hot-issues'}}"Hot" Issues{{/link-to}}
+    &bull;
+    {{#link-to 'buildbots'}}Buildbots{{/link-to}}
+    &bull;
+    {{#link-to 'triage'}}Triage{{/link-to}}
+    &bull;
+    {{#link-to 'links'}}Useful Links{{/link-to}}
+</nav>
 
-    <h4>Sections:</h4>
-    <h5>
-        {{#link-to 'summary'}}Home{{/link-to}}
-        &bull;
-        {{#link-to 'fcp'}}FCPs{{/link-to}}
-        &bull;
-        {{#link-to 'releases'}}Nightlies{{/link-to}}
-        &bull;
-        {{#link-to 'issues'}}Issues{{/link-to}}
-        &bull;
-        {{#link-to 'prs'}}Pull Requests{{/link-to}}
-        &bull;
-        {{#link-to 'hot-issues'}}"Hot" Issues{{/link-to}}
-        &bull;
-        {{#link-to 'buildbots'}}Buildbots{{/link-to}}
-        &bull;
-        {{#link-to 'triage'}}Triage{{/link-to}}
-        &bull;
-        {{#link-to 'links'}}Useful Links{{/link-to}}
-    </h5>
-    <hr/>
+<div class="container">
 
     {{outlet}}