Animatify

Installation

Bower

Run bower install bitaculous/assetify.

npm

Run npm install bitaculous/assetify.

Sprockets

1. Add animatify to your Gemfile:

   gem 'bitaculous-animatify', github: 'bitaculous/animatify'

2. Run bundle to install all dependencies with Bundler

Usage

First, import animatify:

@import animatify

The most basic option is simply:

@include animatify

which includes the “full package”.

To include only the “animated” class:

@include animated

or

@include animated($selector: '.foobar', $duration: 2s)

Let's say you just want the “bounce” animation:

@include animation('bounce')

But you can get much more detailed:

@include animation($name: 'bounce', $selector: '.foobar')

Options

Prefixes

Animatify uses under the hood Bourbon by thoughtbot, inc. to implement all animations, you can disable prefixes with:

$prefix-for-webkit:    false
$prefix-for-mozilla:   false
$prefix-for-microsoft: false
$prefix-for-opera:     false

Implemented effects

Bouncing

• Bounce
• Bounce in

Other

• Fade in
• Flash
• Pulse
• Shake
• Swing
• Tada
• Wobble

Development

Run specs with RSpec

Run rspec.

or via Guard:

$ guard -g spec

See Test Coverage

Run COVERAGE=true rspec.

Run RuboCop

Run rubocop.

To run all specs and RuboCop altogether, run rake.

Code Status

Bug Reports

Github Issues are used for managing bug reports and feature requests. If you run into issues, please search the issues and submit new problems here.

Versioning

This library aims to adhere to Semantic Versioning 2.0.0. Violations of this scheme should be reported as bugs. Specifically, if a minor or patch version is released that breaks backward compatibility, that version should be immediately yanked and / or a new version should be immediately released that restores compatibility.

Credits

All animations originate from animate.css by Daniel Eden.

Animatify uses Bourbon by thoughtbot, inc. to implement all animations.

License

Animatify is released under the MIT License (MIT), see LICENSE.