Add API header

Author: jarrodyellets

assets/styles/main.scss

@@ -49,10 +49,8 @@ body {
   margin: 10px 0;
   border-top: none;
   width: auto;
-  display: inline-block;
   font-weight: 700;
   font-size: 2.3rem;
-  display: block;
 }
 
 .hapi-family-header {

components/api/ApiNav.vue

@@ -110,6 +110,14 @@ export default {
       //Add classes to API nav
       let lis = document.querySelectorAll(".api-nav-select-wrapper li");
       let code = document.querySelectorAll(".api-nav-select-wrapper code");
+      let wrapper = document.querySelector(".markdown-wrapper");
+      let hapiHeader = document.createElement("h1");
+      hapiHeader.innerHTML =
+        "API <span class='api-version-span'>v" +
+        this.version.match(/.*(?=\.)/)[0] +
+        ".x";
+      hapiHeader.setAttribute("class", "hapi-header");
+      wrapper.insertBefore(hapiHeader, wrapper.firstChild);
       const height = document
         .querySelector(".api-nav-select-wrapper")
         .getBoundingClientRect().bottom;

pages/api.vue

@@ -277,11 +277,12 @@ export default {
             });
           }
           break;
+        } else if (!this.versions.includes(this.$route.query.v)) {
+          this.$router.push({
+            query: { v: this.versions[0] },
+            hash: this.$route.hash
+          });
         }
-        this.$router.push({
-          query: { v: this.versions[0] },
-          hash: this.$route.hash
-        });
       }
     }