2014-05-21 12:17:39 -05:00
|
|
|
/*
|
|
|
|
* Reusable keyframe animations
|
|
|
|
*
|
|
|
|
* Table of Contents
|
|
|
|
*
|
|
|
|
* Off-Canvas
|
|
|
|
* Fade In
|
|
|
|
* Fade Out
|
|
|
|
*/
|
2014-02-23 09:07:01 -05:00
|
|
|
|
2014-05-21 12:17:39 -05:00
|
|
|
|
|
|
|
/* ==========================================================================
|
|
|
|
Off-Canvas
|
|
|
|
========================================================================== */
|
|
|
|
|
|
|
|
@include keyframes(off-canvas) {
|
|
|
|
from {
|
|
|
|
opacity: 0;
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
2014-02-23 09:07:01 -05:00
|
|
|
}
|
|
|
|
|
2014-05-21 12:17:39 -05:00
|
|
|
|
|
|
|
/* ==========================================================================
|
|
|
|
Fade In
|
|
|
|
TODO: Make the fadeIn keyframe name hyphenated, not camelCase
|
|
|
|
========================================================================== */
|
|
|
|
|
2014-02-23 09:07:01 -05:00
|
|
|
@include keyframes(fadeIn) {
|
|
|
|
from {
|
|
|
|
opacity: 0;
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2014-05-21 12:17:39 -05:00
|
|
|
/* ==========================================================================
|
|
|
|
Fade Out
|
|
|
|
TODO: Make the fadeIn keyframe name hyphenated, not camelCase
|
|
|
|
========================================================================== */
|
|
|
|
|
|
|
|
@include keyframes(fade-out) {
|
|
|
|
from {
|
|
|
|
opacity: 1;
|
|
|
|
}
|
|
|
|
to {
|
|
|
|
opacity: 0;
|
|
|
|
}
|
|
|
|
}
|