WIP Animations all over site

- Run a transition In for each page
- Involve a "loader" panel on page change
- TODO: tweak the animations and finish the concept

src/animations/TitleSite.js

@@ -0,0 +1,34 @@
+import anime from 'animejs'
+import ScrollOut from 'scroll-out'
+import { animDuration } from '../utils/store'
+
+
+/*
+** Transition In
+*/
+export const animateIn = callback => {
+    // On scroll animation
+    const title = ScrollOut({
+        once: true,
+        targets: '.title-location',
+        onShown (el) {
+            // Each letters
+            anime({
+                targets: el.querySelectorAll('span'),
+                translateY: ['100%', 0],
+                delay: anime.stagger(40),
+                duration: 1000,
+                easing: 'easeOutQuart'
+            })
+
+            // Word in between
+            anime({
+                targets: el.querySelectorAll('em span'),
+                opacity: [0, 1],
+                delay: anime.stagger(80, { start: 400 }),
+                duration: 1000,
+                easing: 'easeOutQuart'
+            })
+        }
+    })
+}