chore: add docs site

docs/guide/metainfo.md

@@ -0,0 +1,69 @@
+# Defining `metaInfo`
+
+You can define a `[keyName]` property in any of your components, by default this is `metaInfo`.
+
+See the [API](/api) for a list of recognised `metaInfo` properties
+
+::: tip Note
+Altough we talk about the `metaInfo` variable on this page, please note that the keyName is [configurable](/api/#keyname) and could be different in your case. E.g. [Nuxt.js](https://nuxtjs.org/api/pages-head#the-head-method) uses `head` as keyName
+:::
+
+**App.vue:**
+```html
+<template>
+  <div id="app">
+    <router-view></router-view>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'App',
+    metaInfo: {
+      // if no subcomponents specify a metaInfo.title, this title will be used
+      title: 'Default Title',
+      // all titles will be injected into this template
+      titleTemplate: '%s | My Awesome Webapp'
+    }
+  }
+</script>
+```
+
+**Home.vue**
+```html
+<template>
+  <div id="page">
+    <h1>Home Page</h1>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'Home',
+    metaInfo: {
+      title: 'My Awesome Webapp',
+      // override the parent template and just use the above title only
+      titleTemplate: null
+    }
+  }
+</script>
+```
+
+**About.vue**
+```html
+<template>
+  <div id="page">
+    <h1>About Page</h1>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'About',
+    metaInfo: {
+      // title will be injected into parent titleTemplate
+      title: 'About Us'
+    }
+  }
+</script>
+```