fix: collapse header mobile

components/templates/TheHeader.vue

@@ -22,6 +22,7 @@
           v-else
           :key="index"
           :label="nav.title"
+          collapsible
         >
           <b-navbar-item
             v-for="(sub, i) in nav.subMenu"
@@ -104,7 +105,13 @@ export default class TheHeader extends Vue {
           link: '/'
         }
       ]
+    },
+    {
+      title: 'Contact Us',
+      link: '/contact-us',
+      subMenu: []
     }
+
   ]
 }
 </script>

components/templates/contact-us/ContactForm.vue

@@ -0,0 +1 @@
+

components/templates/contact-us/FormContact.vue

@@ -0,0 +1,13 @@
+<template>
+  <section class="hero is-fullheight">
+   sdsdfsd
+  </section>
+</template>
+
+<script>
+import { Vue, Component } from 'nuxt-property-decorator'
+
+@Component
+export default class ContactForm extends Vue {
+}
+</script>

components/templates/home/Banner.vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="hero-body">
+    <div class="container has-text-centered">
+      <div class="columns is-vcentered">
+        <div class="column is-5">
+          <figure class="image is-5by3">
+            <img
+              class="main-image"
+              src="~assets/images/logo.png"
+              alt="Description"
+            >
+          </figure>
+        </div>
+        <div class="column is-6 is-offset-1">
+          <h1 class="title is-2">
+            Superhero Scaffolding
+          </h1>
+          <h2 class="subtitle is-4">
+            Let this cover page describe a product or service.
+          </h2>
+          <br>
+          <p class="has-text-centered">
+            <a class="button is-medium is-info is-outlined">
+              Learn more
+            </a>
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { Vue, Component } from 'nuxt-property-decorator'
+
+@Component
+export default class Banner extends Vue {
+
+}
+</script>
+<style scoped>
+.main-image {
+  min-width: 300px;
+}
+</style>

pages/contact-us.vue

@@ -0,0 +1,13 @@
+<template>
+  <div>
+    Contact
+  </div>
+</template>
+
+<script>
+import { Vue, Component } from 'nuxt-property-decorator'
+
+@Component
+export default class ContactUs extends Vue {
+}
+</script>

pages/index.vue

@@ -1,12 +1,18 @@
 <template>
   <div>
-
+    <banner />
   </div>
 </template>
 
 <script>
+import { Vue, Component } from 'nuxt-property-decorator'
+import Banner from '@/components/templates/home/Banner'
 
-export default {
-  name: 'HomePage'
+@Component({
+  components: {
+    Banner
+  }
+})
+export default class Index extends Vue {
 }
 </script>