Mairs animations

Mairs animations are Sass mixins that generate Vue animations. More animations are to be added later.

example: @include m-animation-fade($name, $x: 0, $y: 0, $duration: 0.2s, $timing: ease)

m-animation-fade($name, $x, $y, $duration, $timing)

fades the element into the page

property	optional	accessing
$name	false	the vue animation name
$x	true	the movement on x
$y	true	the movement on y
$duration	true	to change the animation duration
$timing	true	to change the animation timing function

m-animation-slide($name, $x, $y, $duration, $timing)

slides the element into the page

parameter	optional	description
$name	false	the vue animation name
$x	true	the movement on x
$y	true	the movement on y
$duration	true	to change the animation duration
$timing	true	to change the animation timing function

Usage example

<template>
  <transition name="myAnimation">
    <div v-if="div_shown"></div>
  </transition>
</template>
<style lang="scss">
@include m-animation-fade("myAnimation", 0, 0, 0.4s, ease-out);
</style>