Cacher is the code snippet organizer for pro developers

@mixin anim-reveal($type:'fadeIn',$duration:1s){

  @if $type == 'fadeIn'{
      @-moz-keyframes reveal {
        from { opacity:0; }
        to { opacity:1; }
      }
      @-webkit-keyframes reveal {
          from { opacity:0; }
          to { opacity:1; }
      }
      @keyframes reveal {
          from { opacity:0; }
          to { opacity:1; }
      }
  }
  @if $type == 'fadeInBottom'{
      @-moz-keyframes reveal {
        from { opacity:0; transform: translate(0px,15px) }
        to { opacity:1; transform: translate(0px,0px) }
      }
      @-webkit-keyframes reveal {
        from { opacity:0; transform: translate(0px,15px) }
        to { opacity:1; transform: translate(0px,0px) }
      }
      @keyframes reveal {
        from { opacity:0; transform: translate(0px,15px) }
        to { opacity:1; transform: translate(0px,0px) }
      }
  }
  @if $type == 'zoomIn'{
      @-moz-keyframes reveal {
        from { transform:scale(0,0) }
        to { transform:scale(1,1) }
      }
      @-webkit-keyframes reveal {
        from { transform:scale(0,0) }
        to { transform:scale(1,1) }
      }
      @keyframes reveal {
        from { transform:scale(0,0) }
        to { transform:scale(1,1) }
      }
  }

  -webkit-animation: reveal $duration ease;
  -moz-animation: reveal $duration ease;
  -o-animation: reveal $duration ease;
  -ms-animation: reveal $duration ease;
  animation: reveal $duration ease;

}