ryan-fitchett-scss-animations v1.0.1

Ryan SCSS Animations

Overview

This package contains a series of animations written by Ryan Fitchett with the purpose of providing a consistent style and the ability to be easily extended.

Installation

npm i ryan-fitchett-scss-animations

Usage

The package provides a default set for animations which can be accessed via

@import ./animations/classes;

The default animation properties can be changed by importing "_index.scss" and modifying the default variables before importing "./animations/classes".

@import ./_index.scss;

$countDefault: 1;
$durationDefault: 1s;
$delayDefault: 0s;
$functionDefault: ease;
$fillDefault: both;
$visibilityDefault: hidden;

@import ./animations/classes;

Alternatively you can create custom variations my importing each animations individually.

.your-class-name {
  @include bounce(
    $count: 1,
    $duration: 1s`, 
    $delay: 0s,
    $function: ease, 
    $fill: both, 
    $visibility: hidden);
}