Compass has a reset, but no Normalize, nor animation. But plugins can help in that.
We'll look into the animation plugin, and how to install it when using CodeKit. Grab the animation plugin here (just download the zip). Also see a list of Compass plugins here and here.
Put it somewhere in your hard drive
Don't put them inside the CodeKit app, when updated they get overwritten massive forehead slap.
Require the plugin in config.rb file
In your projects Compass config file:
require "/Volumes/HD/Documents/path/to/your/file/lib/animation.rb"You need to reference the animation.rb inside the lib folder.
You'll get the path easily from Finder: right click the file > Copy Path > Terminal Path.
Import it and use it
In your scss file:
@import 'animation';
// And then use it of course
// This will spin an element around
@include keyframes(rotate) {
0% {
@include rotate(0deg);
}
100% {
@include rotate(360deg);
}
}Then of course apply the animation to an element.
.circle-thing {
@include animation(rotate 4s infinite linear);
}Also, the amazing thing about Animate plugin that you can use all the Animate.css built-in animations. More here.