expeditaea 1.0.0

package/examples/routes-meta/store/index.js

@@ -0,0 +1,9 @@
+export const state = () => ({
+  theme: 'light'
+})
+
+export const mutations = {
+  SET_THEME (state, theme) {
+    state.theme = theme
+  }
+}

package/examples/routes-transitions/README.md

@@ -0,0 +1,3 @@
+# Routes transitions with Nuxt
+
+https://nuxtjs.org/examples/routes-transitions

package/examples/routes-transitions/assets/main.css

@@ -0,0 +1,45 @@
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+}
+
+.container {
+  text-align: center;
+  padding-top: 200px;
+  font-size: 20px;
+  transition: all .5s cubic-bezier(.55,0,.1,1);
+}
+
+.page-enter-active, .page-leave-active {
+  transition: opacity .5s
+}
+.page-enter, .page-leave-active {
+  opacity: 0
+}
+
+.bounce-enter-active {
+  animation: bounce-in .8s;
+}
+.bounce-leave-active {
+  animation: bounce-out .5s;
+}
+@keyframes bounce-in {
+  0% { transform: scale(0) }
+  50% { transform: scale(1.5) }
+  100% { transform: scale(1) }
+}
+@keyframes bounce-out {
+  0% { transform: scale(1) }
+  50% { transform: scale(1.5) }
+  100% { transform: scale(0) }
+}
+
+.slide-left-enter,
+.slide-right-leave-active {
+  opacity: 0;
+  transform: translate(30px, 0);
+}
+.slide-left-leave-active,
+.slide-right-enter {
+  opacity: 0;
+  transform: translate(-30px, 0);
+}

package/examples/routes-transitions/nuxt.config.js

@@ -0,0 +1,3 @@
+export default {
+  css: ['~/assets/main.css']
+}

package/examples/routes-transitions/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "example-routes-transitions",
+  "dependencies": {
+    "nuxt": "latest"
+  },
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
+    "post-update": "yarn upgrade --latest"
+  }
+}

package/examples/routes-transitions/pages/about.vue

@@ -0,0 +1,14 @@
+<template>
+  <div class="container">
+    <h1>About page</h1>
+    <NuxtLink to="/">
+      Home page
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+  transition: 'bounce'
+}
+</script>

package/examples/routes-transitions/pages/index.vue

@@ -0,0 +1,15 @@
+<template>
+  <div class="container">
+    <h1>Home page</h1>
+    <p>
+      <NuxtLink to="/about">
+        About page
+      </NuxtLink>
+    </p>
+    <p>
+      <NuxtLink to="/users">
+        Lists of users
+      </NuxtLink>
+    </p>
+  </div>
+</template>

package/examples/routes-transitions/pages/users.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="container">
+    <NuxtLink v-if="page > 1" :to="'?page=' + (page - 1)">
+      &lt; Prev
+    </NuxtLink>
+    <a v-else class="disabled">
+      &lt; Prev
+    </a>
+    <span>{{ page }}/{{ totalPages }}</span>
+    <NuxtLink v-if="page < totalPages" :to="'?page=' + (page + 1)">
+      Next &gt;
+    </NuxtLink>
+    <a v-else class="disabled">
+      Next &gt;
+    </a>
+    <ul>
+      <li v-for="user in users" :key="user.id">
+        <img :src="user.avatar" class="avatar">
+        <span>{{ user.first_name }} {{ user.last_name }}</span>
+      </li>
+    </ul>
+    <p>
+      <NuxtLink to="/">
+        Back home
+      </NuxtLink>
+    </p>
+  </div>
+</template>
+
+<script>
+export default {
+  // Key for <NuxtChild> (transitions)
+  key: to => to.fullPath,
+  // Called to know which transition to apply
+  transition (to, from) {
+    if (!from) { return 'slide-left' }
+    return +to.query.page < +from.query.page ? 'slide-right' : 'slide-left'
+  },
+  async asyncData ({ query }) {
+    const page = +query.page || 1
+    const data = await fetch(`https://reqres.in/api/users?page=${page}`).then(res => res.json())
+
+    return {
+      page: +data.page,
+      totalPages: data.total_pages,
+      users: data.data
+    }
+  },
+  // Watch for $route.query.page to call Component methods (asyncData, fetch, validate, layout, etc.)
+  watchQuery: ['page']
+}
+</script>
+
+<style scoped>
+a {
+  display: inline-block;
+  margin: 0 1em;
+  color: #34495e;
+  text-decoration: none;
+}
+a.disabled {
+  color: #ccc;
+}
+ul {
+  margin: auto;
+  padding: 0;
+  width: 100%;
+  max-width: 400px;
+  padding-top: 40px;
+}
+li {
+  list-style-type: none;
+  width: 400px;
+  border: 1px #ddd solid;
+  overflow: hidden;
+}
+li img {
+  float: left;
+  width: 100px;
+  height: 100px;
+}
+li span {
+  display: inline-block;
+  padding-top: 40px;
+  text-transform: uppercase;
+}
+</style>

package/examples/scroll-behavior/README.md

@@ -0,0 +1,3 @@
+# Custom scroll behavior with Nuxt
+
+https://nuxtjs.org/examples/custom-scroll-behavior

package/examples/scroll-behavior/assets/main.css

@@ -0,0 +1,69 @@
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+}
+
+.container {
+  padding: 20px;
+  text-align: center;
+  font-size: 20px;
+  transition: all .5s cubic-bezier(.55,0,.1,1);
+}
+
+.child {
+  position: absolute;
+  top: 200px;
+  left: 0;
+  width: 100%;
+  text-align: center;
+  font-size: 16px;
+  transition: all .5s cubic-bezier(.55,0,.1,1);
+}
+
+ul {
+  list-style: none;
+  padding: 0;
+}
+
+.page-enter-active, .page-leave-active {
+  transition: opacity .5s
+}
+.page-enter, .page-leave-active {
+  opacity: 0
+}
+
+.bounce-enter-active {
+  animation: bounce-in .8s;
+}
+.bounce-leave-active {
+  animation: bounce-out .5s;
+}
+@keyframes bounce-in {
+  0% { transform: scale(0) }
+  50% { transform: scale(1.5) }
+  100% { transform: scale(1) }
+}
+@keyframes bounce-out {
+  0% { transform: scale(1) }
+  50% { transform: scale(1.5) }
+  100% { transform: scale(0) }
+}
+
+.slide-left-enter,
+.slide-right-leave-active {
+  opacity: 0;
+  transform: translate(30px, 0);
+}
+.slide-left-leave-active,
+.slide-right-enter {
+  opacity: 0;
+  transform: translate(-30px, 0);
+}
+
+.fade-enter,
+.fade-leave-active {
+  opacity: 0;
+}
+.fade-leave-active,
+.fade-enter {
+  opacity: 0;
+}

package/examples/scroll-behavior/layouts/default2.vue

@@ -0,0 +1,3 @@
+<template>
+  <Nuxt />
+</template>

package/examples/scroll-behavior/nuxt.config.js

@@ -0,0 +1,4 @@
+export default {
+  css: ['~/assets/main.css'],
+  modules: ['@nuxtjs/axios']
+}

package/examples/scroll-behavior/package.json

@@ -0,0 +1,14 @@
+{
+  "name": "example-scroll-behavior",
+  "dependencies": {
+    "@nuxtjs/axios": "^5.3.6",
+    "nuxt": "latest",
+    "vue-router": "https://github.com/homerjam/vue-router#dist"
+  },
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt start",
+    "post-update": "yarn upgrade --latest"
+  }
+}

package/examples/scroll-behavior/pages/about/contact.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="child">
+    <h1>Contact</h1>
+    <div class="spacer" style="width: 100%; height: 3000px; background: grey" />
+  </div>
+</template>
+
+<script>
+export default {
+  scrollToTop: true,
+  transition: 'fade'
+}
+</script>

package/examples/scroll-behavior/pages/about/profile.vue

@@ -0,0 +1,12 @@
+<template>
+  <div class="child">
+    <h1>Profile</h1>
+    <div class="spacer" style="width: 100%; height: 3000px; background: grey" />
+  </div>
+</template>
+
+<script>
+export default {
+  transition: 'fade'
+}
+</script>

package/examples/scroll-behavior/pages/about.vue

@@ -0,0 +1,27 @@
+<template>
+  <div class="container">
+    <h1>About page</h1>
+    <ul>
+      <li>
+        <NuxtLink to="/about/profile">
+          Profile
+        </NuxtLink>
+      </li>
+      <li>
+        <NuxtLink to="/about/contact">
+          Contact
+        </NuxtLink>
+      </li>
+    </ul>
+    <NuxtChild />
+    <NuxtLink to="/">
+      Home page
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+  transition: 'fade'
+}
+</script>

package/examples/scroll-behavior/pages/another-long.vue

@@ -0,0 +1,16 @@
+<template>
+  <div class="container">
+    <h1>Another long page</h1>
+    <div class="spacer" style="width: 100%; height: 3000px; background: darkgreen" />
+    <NuxtLink to="/">
+      Home page
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+  layout: 'default2',
+  scrollToTop: true
+}
+</script>

package/examples/scroll-behavior/pages/index.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="container">
+    <h1>Home page</h1>
+    <p>
+      <NuxtLink to="/about">
+        About page
+      </NuxtLink>
+    </p>
+    <p>
+      <NuxtLink to="/users">
+        Lists of users
+      </NuxtLink>
+    </p>
+    <p>
+      <NuxtLink to="/long">
+        Long page
+      </NuxtLink>
+    </p>
+    <p>
+      <NuxtLink to="/long#anchor">
+        Long page #anchor
+      </NuxtLink>
+    </p>
+    <div class="spacer" style="width: 100%; height: 3000px; background: grey" />
+    <p>
+      <NuxtLink to="/another-long">
+        Another long page
+      </NuxtLink>
+    </p>
+  </div>
+</template>

package/examples/scroll-behavior/pages/long.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="container">
+    <h1>Long page</h1>
+    <p>
+      <a href="#anchor">
+        Go to anchor
+      </a>
+    </p>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam neque turpis, tempor vitae accumsan eget, bibendum eget dui. Vestibulum fringilla mi ac nunc malesuada accumsan. Proin mattis, ex vitae rhoncus dapibus, tellus tortor tincidunt metus, sed scelerisque dolor nunc rhoncus enim. Pellentesque semper interdum quam in placerat. Sed ut finibus mi. Aliquam placerat tellus ac tincidunt sodales. Quisque pharetra neque a risus placerat, sed suscipit felis mattis. Maecenas pretium efficitur fringilla. Sed commodo leo congue velit pretium, in consequat ex egestas. Pellentesque gravida vitae elit varius condimentum. Fusce in magna tellus. Proin in odio ac est elementum pharetra.</p>
+    <p>Vivamus dapibus libero sem, eu sagittis lorem hendrerit id. Suspendisse faucibus sapien quis cursus lobortis. Phasellus blandit tellus at arcu ornare fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi ac massa sollicitudin, lacinia lacus porta, cursus mi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc aliquam quis elit ut maximus. Integer blandit ipsum sed elit laoreet consequat. Pellentesque quis volutpat tellus, vitae finibus nulla. Etiam a porta orci. Morbi at libero sit amet tortor eleifend congue. Integer egestas fermentum lacinia. Curabitur dignissim, enim eget consectetur tempor, lacus felis auctor ante, in egestas arcu turpis ut tellus. Phasellus mattis dictum leo, a gravida purus tristique sed. Pellentesque sollicitudin arcu eu augue vehicula, molestie hendrerit sapien mollis.</p>
+    <p>Nunc ullamcorper magna nunc, vitae vestibulum est laoreet vel. Aliquam erat volutpat. Duis vehicula ligula at justo egestas posuere. Mauris pharetra nulla ac pretium eleifend. Mauris purus eros, venenatis sollicitudin ornare id, mattis in lorem. Curabitur tortor magna, viverra eget lorem ultricies, aliquam aliquam libero. Maecenas vestibulum id libero sed fermentum. Praesent consequat dui sed pellentesque commodo. Curabitur finibus purus vel purus mattis luctus. Nullam maximus dapibus orci, ac mattis diam egestas vel. Praesent lorem dolor, congue quis gravida commodo, rhoncus nec justo. In et elementum augue. Donec fringilla imperdiet magna, quis luctus leo placerat sed. Morbi scelerisque in sem eu dapibus. Sed interdum, felis luctus semper viverra, ex lorem posuere velit, in bibendum nunc dolor et diam.</p>
+    <p>Duis pulvinar lorem vel tempus pellentesque. Vivamus imperdiet imperdiet augue, ac rhoncus velit vulputate eu. Sed sed nulla risus. Curabitur ut velit consectetur, semper velit quis, elementum tellus. Ut eget ligula eget leo porta vestibulum. Curabitur ligula magna, rutrum ut enim vitae, gravida sollicitudin augue. Aliquam auctor gravida mauris, nec feugiat ipsum mollis vel. Vivamus nec aliquet ipsum, id scelerisque nibh. Vestibulum iaculis eleifend nunc, vitae efficitur massa egestas et. Ut pulvinar, purus eget viverra sodales, est mauris luctus metus, non luctus tellus diam in elit.</p>
+    <p>Quisque sollicitudin non urna non consectetur. Cras quis dapibus nisi. Maecenas maximus rhoncus neque, a lacinia urna egestas nec. Morbi molestie odio sit amet tempus cursus. Vivamus lorem nunc, malesuada et maximus id, imperdiet eget felis. Ut elementum fringilla velit in mattis. Morbi ut laoreet mi. Aliquam et odio dignissim, fermentum purus sit amet, facilisis lorem. Donec semper mi ut semper tristique. Sed in dolor placerat, porta elit in, tempor felis. Integer metus erat, tristique efficitur quam quis, finibus blandit magna. Nunc sit amet lorem dui. Suspendisse ut vulputate nisi. Integer sit amet sollicitudin libero.</p>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam neque turpis, tempor vitae accumsan eget, bibendum eget dui. Vestibulum fringilla mi ac nunc malesuada accumsan. Proin mattis, ex vitae rhoncus dapibus, tellus tortor tincidunt metus, sed scelerisque dolor nunc rhoncus enim. Pellentesque semper interdum quam in placerat. Sed ut finibus mi. Aliquam placerat tellus ac tincidunt sodales. Quisque pharetra neque a risus placerat, sed suscipit felis mattis. Maecenas pretium efficitur fringilla. Sed commodo leo congue velit pretium, in consequat ex egestas. Pellentesque gravida vitae elit varius condimentum. Fusce in magna tellus. Proin in odio ac est elementum pharetra.</p>
+    <p>Vivamus dapibus libero sem, eu sagittis lorem hendrerit id. Suspendisse faucibus sapien quis cursus lobortis. Phasellus blandit tellus at arcu ornare fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi ac massa sollicitudin, lacinia lacus porta, cursus mi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc aliquam quis elit ut maximus. Integer blandit ipsum sed elit laoreet consequat. Pellentesque quis volutpat tellus, vitae finibus nulla. Etiam a porta orci. Morbi at libero sit amet tortor eleifend congue. Integer egestas fermentum lacinia. Curabitur dignissim, enim eget consectetur tempor, lacus felis auctor ante, in egestas arcu turpis ut tellus. Phasellus mattis dictum leo, a gravida purus tristique sed. Pellentesque sollicitudin arcu eu augue vehicula, molestie hendrerit sapien mollis.</p>
+    <p>Nunc ullamcorper magna nunc, vitae vestibulum est laoreet vel. Aliquam erat volutpat. Duis vehicula ligula at justo egestas posuere. Mauris pharetra nulla ac pretium eleifend. Mauris purus eros, venenatis sollicitudin ornare id, mattis in lorem. Curabitur tortor magna, viverra eget lorem ultricies, aliquam aliquam libero. Maecenas vestibulum id libero sed fermentum. Praesent consequat dui sed pellentesque commodo. Curabitur finibus purus vel purus mattis luctus. Nullam maximus dapibus orci, ac mattis diam egestas vel. Praesent lorem dolor, congue quis gravida commodo, rhoncus nec justo. In et elementum augue. Donec fringilla imperdiet magna, quis luctus leo placerat sed. Morbi scelerisque in sem eu dapibus. Sed interdum, felis luctus semper viverra, ex lorem posuere velit, in bibendum nunc dolor et diam.</p>
+    <p>Duis pulvinar lorem vel tempus pellentesque. Vivamus imperdiet imperdiet augue, ac rhoncus velit vulputate eu. Sed sed nulla risus. Curabitur ut velit consectetur, semper velit quis, elementum tellus. Ut eget ligula eget leo porta vestibulum. Curabitur ligula magna, rutrum ut enim vitae, gravida sollicitudin augue. Aliquam auctor gravida mauris, nec feugiat ipsum mollis vel. Vivamus nec aliquet ipsum, id scelerisque nibh. Vestibulum iaculis eleifend nunc, vitae efficitur massa egestas et. Ut pulvinar, purus eget viverra sodales, est mauris luctus metus, non luctus tellus diam in elit.</p>
+    <p>Quisque sollicitudin non urna non consectetur. Cras quis dapibus nisi. Maecenas maximus rhoncus neque, a lacinia urna egestas nec. Morbi molestie odio sit amet tempus cursus. Vivamus lorem nunc, malesuada et maximus id, imperdiet eget felis. Ut elementum fringilla velit in mattis. Morbi ut laoreet mi. Aliquam et odio dignissim, fermentum purus sit amet, facilisis lorem. Donec semper mi ut semper tristique. Sed in dolor placerat, porta elit in, tempor felis. Integer metus erat, tristique efficitur quam quis, finibus blandit magna. Nunc sit amet lorem dui. Suspendisse ut vulputate nisi. Integer sit amet sollicitudin libero.</p>
+    <h2 id="anchor">
+      Anchor
+    </h2>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam neque turpis, tempor vitae accumsan eget, bibendum eget dui. Vestibulum fringilla mi ac nunc malesuada accumsan. Proin mattis, ex vitae rhoncus dapibus, tellus tortor tincidunt metus, sed scelerisque dolor nunc rhoncus enim. Pellentesque semper interdum quam in placerat. Sed ut finibus mi. Aliquam placerat tellus ac tincidunt sodales. Quisque pharetra neque a risus placerat, sed suscipit felis mattis. Maecenas pretium efficitur fringilla. Sed commodo leo congue velit pretium, in consequat ex egestas. Pellentesque gravida vitae elit varius condimentum. Fusce in magna tellus. Proin in odio ac est elementum pharetra.</p>
+    <p>Vivamus dapibus libero sem, eu sagittis lorem hendrerit id. Suspendisse faucibus sapien quis cursus lobortis. Phasellus blandit tellus at arcu ornare fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi ac massa sollicitudin, lacinia lacus porta, cursus mi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc aliquam quis elit ut maximus. Integer blandit ipsum sed elit laoreet consequat. Pellentesque quis volutpat tellus, vitae finibus nulla. Etiam a porta orci. Morbi at libero sit amet tortor eleifend congue. Integer egestas fermentum lacinia. Curabitur dignissim, enim eget consectetur tempor, lacus felis auctor ante, in egestas arcu turpis ut tellus. Phasellus mattis dictum leo, a gravida purus tristique sed. Pellentesque sollicitudin arcu eu augue vehicula, molestie hendrerit sapien mollis.</p>
+    <p>Nunc ullamcorper magna nunc, vitae vestibulum est laoreet vel. Aliquam erat volutpat. Duis vehicula ligula at justo egestas posuere. Mauris pharetra nulla ac pretium eleifend. Mauris purus eros, venenatis sollicitudin ornare id, mattis in lorem. Curabitur tortor magna, viverra eget lorem ultricies, aliquam aliquam libero. Maecenas vestibulum id libero sed fermentum. Praesent consequat dui sed pellentesque commodo. Curabitur finibus purus vel purus mattis luctus. Nullam maximus dapibus orci, ac mattis diam egestas vel. Praesent lorem dolor, congue quis gravida commodo, rhoncus nec justo. In et elementum augue. Donec fringilla imperdiet magna, quis luctus leo placerat sed. Morbi scelerisque in sem eu dapibus. Sed interdum, felis luctus semper viverra, ex lorem posuere velit, in bibendum nunc dolor et diam.</p>
+    <p>Duis pulvinar lorem vel tempus pellentesque. Vivamus imperdiet imperdiet augue, ac rhoncus velit vulputate eu. Sed sed nulla risus. Curabitur ut velit consectetur, semper velit quis, elementum tellus. Ut eget ligula eget leo porta vestibulum. Curabitur ligula magna, rutrum ut enim vitae, gravida sollicitudin augue. Aliquam auctor gravida mauris, nec feugiat ipsum mollis vel. Vivamus nec aliquet ipsum, id scelerisque nibh. Vestibulum iaculis eleifend nunc, vitae efficitur massa egestas et. Ut pulvinar, purus eget viverra sodales, est mauris luctus metus, non luctus tellus diam in elit.</p>
+    <p>Quisque sollicitudin non urna non consectetur. Cras quis dapibus nisi. Maecenas maximus rhoncus neque, a lacinia urna egestas nec. Morbi molestie odio sit amet tempus cursus. Vivamus lorem nunc, malesuada et maximus id, imperdiet eget felis. Ut elementum fringilla velit in mattis. Morbi ut laoreet mi. Aliquam et odio dignissim, fermentum purus sit amet, facilisis lorem. Donec semper mi ut semper tristique. Sed in dolor placerat, porta elit in, tempor felis. Integer metus erat, tristique efficitur quam quis, finibus blandit magna. Nunc sit amet lorem dui. Suspendisse ut vulputate nisi. Integer sit amet sollicitudin libero.</p>
+    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam neque turpis, tempor vitae accumsan eget, bibendum eget dui. Vestibulum fringilla mi ac nunc malesuada accumsan. Proin mattis, ex vitae rhoncus dapibus, tellus tortor tincidunt metus, sed scelerisque dolor nunc rhoncus enim. Pellentesque semper interdum quam in placerat. Sed ut finibus mi. Aliquam placerat tellus ac tincidunt sodales. Quisque pharetra neque a risus placerat, sed suscipit felis mattis. Maecenas pretium efficitur fringilla. Sed commodo leo congue velit pretium, in consequat ex egestas. Pellentesque gravida vitae elit varius condimentum. Fusce in magna tellus. Proin in odio ac est elementum pharetra.</p>
+    <p>Vivamus dapibus libero sem, eu sagittis lorem hendrerit id. Suspendisse faucibus sapien quis cursus lobortis. Phasellus blandit tellus at arcu ornare fermentum. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Morbi ac massa sollicitudin, lacinia lacus porta, cursus mi. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nunc aliquam quis elit ut maximus. Integer blandit ipsum sed elit laoreet consequat. Pellentesque quis volutpat tellus, vitae finibus nulla. Etiam a porta orci. Morbi at libero sit amet tortor eleifend congue. Integer egestas fermentum lacinia. Curabitur dignissim, enim eget consectetur tempor, lacus felis auctor ante, in egestas arcu turpis ut tellus. Phasellus mattis dictum leo, a gravida purus tristique sed. Pellentesque sollicitudin arcu eu augue vehicula, molestie hendrerit sapien mollis.</p>
+    <p>Nunc ullamcorper magna nunc, vitae vestibulum est laoreet vel. Aliquam erat volutpat. Duis vehicula ligula at justo egestas posuere. Mauris pharetra nulla ac pretium eleifend. Mauris purus eros, venenatis sollicitudin ornare id, mattis in lorem. Curabitur tortor magna, viverra eget lorem ultricies, aliquam aliquam libero. Maecenas vestibulum id libero sed fermentum. Praesent consequat dui sed pellentesque commodo. Curabitur finibus purus vel purus mattis luctus. Nullam maximus dapibus orci, ac mattis diam egestas vel. Praesent lorem dolor, congue quis gravida commodo, rhoncus nec justo. In et elementum augue. Donec fringilla imperdiet magna, quis luctus leo placerat sed. Morbi scelerisque in sem eu dapibus. Sed interdum, felis luctus semper viverra, ex lorem posuere velit, in bibendum nunc dolor et diam.</p>
+    <p>Duis pulvinar lorem vel tempus pellentesque. Vivamus imperdiet imperdiet augue, ac rhoncus velit vulputate eu. Sed sed nulla risus. Curabitur ut velit consectetur, semper velit quis, elementum tellus. Ut eget ligula eget leo porta vestibulum. Curabitur ligula magna, rutrum ut enim vitae, gravida sollicitudin augue. Aliquam auctor gravida mauris, nec feugiat ipsum mollis vel. Vivamus nec aliquet ipsum, id scelerisque nibh. Vestibulum iaculis eleifend nunc, vitae efficitur massa egestas et. Ut pulvinar, purus eget viverra sodales, est mauris luctus metus, non luctus tellus diam in elit.</p>
+    <p>Quisque sollicitudin non urna non consectetur. Cras quis dapibus nisi. Maecenas maximus rhoncus neque, a lacinia urna egestas nec. Morbi molestie odio sit amet tempus cursus. Vivamus lorem nunc, malesuada et maximus id, imperdiet eget felis. Ut elementum fringilla velit in mattis. Morbi ut laoreet mi. Aliquam et odio dignissim, fermentum purus sit amet, facilisis lorem. Donec semper mi ut semper tristique. Sed in dolor placerat, porta elit in, tempor felis. Integer metus erat, tristique efficitur quam quis, finibus blandit magna. Nunc sit amet lorem dui. Suspendisse ut vulputate nisi. Integer sit amet sollicitudin libero.</p>
+    <NuxtLink to="/">
+      Home page
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+  transition: 'fade'
+}
+</script>

package/examples/scroll-behavior/pages/users.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="container">
+    <NuxtLink v-if="page > 1" :to="'?page=' + (page - 1)">
+      &lt; Prev
+    </NuxtLink>
+    <a v-else class="disabled">
+      &lt; Prev
+    </a>
+    <span>{{ page }}/{{ totalPages }}</span>
+    <NuxtLink v-if="page < totalPages" :to="'?page=' + (page + 1)">
+      Next &gt;
+    </NuxtLink>
+    <a v-else class="disabled">
+      Next &gt;
+    </a>
+    <ul>
+      <li v-for="user in users" :key="user.id">
+        <img :src="user.avatar" class="avatar">
+        <span>{{ user.first_name }} {{ user.last_name }}</span>
+      </li>
+    </ul>
+    <p>
+      <NuxtLink to="/">
+        Back home
+      </NuxtLink>
+    </p>
+  </div>
+</template>
+
+<script>
+
+export default {
+  // Key for <NuxtChild> (transitions)
+  key: to => to.fullPath,
+  // Called to know which transition to apply
+  transition (to, from) {
+    if (!from) { return 'slide-left' }
+    return +to.query.page < +from.query.page ? 'slide-right' : 'slide-left'
+  },
+  async asyncData ({ query, $axios }) {
+    const page = +query.page || 1
+    const data = await $axios.$get(`https://reqres.in/api/users?page=${page}`)
+    return {
+      page: +data.page,
+      totalPages: data.total_pages,
+      users: data.data
+    }
+  },
+  // Watch for $route.query.page to call Component methods (asyncData, fetch, validate, layout, etc.)
+  watchQuery: ['page']
+}
+</script>
+
+<style scoped>
+a {
+  display: inline-block;
+  margin: 0 1em;
+  color: #34495e;
+  text-decoration: none;
+}
+a.disabled {
+  color: #ccc;
+}
+ul {
+  margin: auto;
+  padding: 0;
+  width: 100%;
+  max-width: 400px;
+  padding-top: 40px;
+}
+li {
+  list-style-type: none;
+  width: 400px;
+  border: 1px #ddd solid;
+  overflow: hidden;
+}
+li img {
+  float: left;
+  width: 100px;
+  height: 100px;
+}
+li span {
+  display: inline-block;
+  padding-top: 40px;
+  text-transform: uppercase;
+}
+</style>

package/examples/spa/README.md

@@ -0,0 +1,2 @@
+# Nuxt in SPA mode
+

package/examples/spa/assets/main.css

@@ -0,0 +1,6 @@
+.appear-active {
+  transition: opacity .5s
+}
+.appear {
+  opacity: 0
+}

package/examples/spa/nuxt.config.js

@@ -0,0 +1,41 @@
+export default {
+  /*
+  ** Single Page Application mode
+  ** Means no SSR
+  */
+  mode: 'spa',
+  /*
+  ** Headers of the page (works with SPA!)
+  */
+  head: {
+    title: 'SPA mode with Nuxt',
+    meta: [
+      { charset: 'utf-8' },
+      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+      { hid: 'description', name: 'description', content: 'Single Page Application made with Nuxt' }
+    ],
+    link: [
+      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
+    ]
+  },
+  /*
+  ** Add css for appear transition
+  */
+  css: ['~/assets/main.css'],
+  /*
+  ** Customize loading indicator
+  */
+  loadingIndicator: {
+    /*
+    ** See https://nuxtjs.org/api/configuration-loading-indicator for available loading indicators
+    ** You can add a custom indicator by giving a path
+    */
+    // name: 'folding-cube',
+    /*
+    ** You can give custom options given to the template
+    ** See https://github.com/nuxt/nuxt.js/blob/dev/lib/app/views/loading/folding-cube.html
+    */
+    // color: '#DBE1EC'
+    // background: 'white'
+  }
+}

package/examples/spa/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "example-spa",
+  "dependencies": {
+    "nuxt": "latest"
+  },
+  "scripts": {
+    "dev": "nuxt",
+    "build": "nuxt build",
+    "start": "nuxt",
+    "post-update": "yarn upgrade --latest"
+  }
+}

package/examples/spa/pages/about.vue

@@ -0,0 +1,18 @@
+<template>
+  <div>
+    <p>Hi from {{ name }}</p>
+    <NuxtLink to="/">
+      Home page
+    </NuxtLink>
+  </div>
+</template>
+
+<script>
+export default {
+  asyncData () {
+    return {
+      name: (process.server ? 'server' : 'client')
+    }
+  }
+}
+</script>

package/examples/spa/pages/index.vue

@@ -0,0 +1,8 @@
+<template>
+  <div>
+    <h1>Welcome!</h1>
+    <NuxtLink to="/about">
+      About page
+    </NuxtLink>
+  </div>
+</template>

package/examples/static-images/README.md

@@ -0,0 +1,3 @@
+# Nuxt with static images
+
+How to use static images with nuxt