From b9c318be6ae85782cf68c789aa9ae34f7556455e Mon Sep 17 00:00:00 2001
From: Sebastien Chopin <seb@chopin.io>
Date: Fri, 18 Aug 2017 16:46:54 +0200
Subject: [PATCH] Add appear transition

---
 examples/spa/assets/main.css |  6 ++++++
 examples/spa/nuxt.config.js  | 13 ++++++++++++-
 2 files changed, 18 insertions(+), 1 deletion(-)
 create mode 100644 examples/spa/assets/main.css

diff --git a/examples/spa/assets/main.css b/examples/spa/assets/main.css
new file mode 100644
index 0000000000..1baea580c6
--- /dev/null
+++ b/examples/spa/assets/main.css
@@ -0,0 +1,6 @@
+.appear-active {
+  transition: opacity .5s
+}
+.appear {
+  opacity: 0
+}
diff --git a/examples/spa/nuxt.config.js b/examples/spa/nuxt.config.js
index 9f8220c71e..0c0d888faf 100644
--- a/examples/spa/nuxt.config.js
+++ b/examples/spa/nuxt.config.js
@@ -1,5 +1,16 @@
 module.exports = {
+  /*
+  ** Single Page Application mode
+  ** Means no SSR
+  */
   mode: 'spa',
+  /*
+  ** Add css for appear transition
+  */
+  css: ['~/assets/main.css'],
+  /*
+  ** Cutomize loading indicator
+  */
   loadingIndicator: {
     /*
     ** See https://github.com/nuxt/nuxt.js/tree/dev/lib/app/views/loading for available loading indicators
@@ -15,6 +26,6 @@ module.exports = {
     ** - background: 'white'
     */
     color: '#222',
-    background: '#eee'
+    background: 'white'
   }
 }