animate-scss 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (68) hide show
  1. data/.gitignore +17 -0
  2. data/.gitmodules +3 -0
  3. data/Gemfile +4 -0
  4. data/LICENSE.txt +22 -0
  5. data/README.md +58 -0
  6. data/Rakefile +7 -0
  7. data/animate-scss.gemspec +25 -0
  8. data/lib/animate-scss.rb +2 -0
  9. data/lib/animate/engine.rb +4 -0
  10. data/lib/animate/version.rb +3 -0
  11. data/vendor/assets/stylesheets/animate.scss +24 -0
  12. data/vendor/assets/stylesheets/animate/bounce.css +29 -0
  13. data/vendor/assets/stylesheets/animate/bounceIn.css +86 -0
  14. data/vendor/assets/stylesheets/animate/bounceInDown.css +86 -0
  15. data/vendor/assets/stylesheets/animate/bounceInLeft.css +86 -0
  16. data/vendor/assets/stylesheets/animate/bounceInRight.css +86 -0
  17. data/vendor/assets/stylesheets/animate/bounceInUp.css +85 -0
  18. data/vendor/assets/stylesheets/animate/bounceOut.css +86 -0
  19. data/vendor/assets/stylesheets/animate/bounceOutDown.css +70 -0
  20. data/vendor/assets/stylesheets/animate/bounceOutLeft.css +70 -0
  21. data/vendor/assets/stylesheets/animate/bounceOutRight.css +70 -0
  22. data/vendor/assets/stylesheets/animate/bounceOutUp.css +70 -0
  23. data/vendor/assets/stylesheets/animate/fadeIn.css +26 -0
  24. data/vendor/assets/stylesheets/animate/fadeInDown.css +54 -0
  25. data/vendor/assets/stylesheets/animate/fadeInDownBig.css +54 -0
  26. data/vendor/assets/stylesheets/animate/fadeInLeft.css +54 -0
  27. data/vendor/assets/stylesheets/animate/fadeInLeftBig.css +51 -0
  28. data/vendor/assets/stylesheets/animate/fadeInRight.css +54 -0
  29. data/vendor/assets/stylesheets/animate/fadeInRightBig.css +54 -0
  30. data/vendor/assets/stylesheets/animate/fadeInUp.css +54 -0
  31. data/vendor/assets/stylesheets/animate/fadeInUpBig.css +54 -0
  32. data/vendor/assets/stylesheets/animate/fadeOut.css +26 -0
  33. data/vendor/assets/stylesheets/animate/fadeOutDown.css +54 -0
  34. data/vendor/assets/stylesheets/animate/fadeOutDownBig.css +54 -0
  35. data/vendor/assets/stylesheets/animate/fadeOutLeft.css +54 -0
  36. data/vendor/assets/stylesheets/animate/fadeOutLeftBig.css +54 -0
  37. data/vendor/assets/stylesheets/animate/fadeOutRight.css +54 -0
  38. data/vendor/assets/stylesheets/animate/fadeOutRightBig.css +51 -0
  39. data/vendor/assets/stylesheets/animate/fadeOutUp.css +51 -0
  40. data/vendor/assets/stylesheets/animate/fadeOutUpBig.css +54 -0
  41. data/vendor/assets/stylesheets/animate/flash.css +26 -0
  42. data/vendor/assets/stylesheets/animate/flip.css +103 -0
  43. data/vendor/assets/stylesheets/animate/flipInX.css +87 -0
  44. data/vendor/assets/stylesheets/animate/flipInY.css +87 -0
  45. data/vendor/assets/stylesheets/animate/flipOutX.css +54 -0
  46. data/vendor/assets/stylesheets/animate/flipOutY.css +51 -0
  47. data/vendor/assets/stylesheets/animate/hinge.css +38 -0
  48. data/vendor/assets/stylesheets/animate/lightSpeedIn.css +39 -0
  49. data/vendor/assets/stylesheets/animate/lightSpeedOut.css +31 -0
  50. data/vendor/assets/stylesheets/animate/pulse.css +29 -0
  51. data/vendor/assets/stylesheets/animate/rollIn.css +28 -0
  52. data/vendor/assets/stylesheets/animate/rollOut.css +56 -0
  53. data/vendor/assets/stylesheets/animate/rotateIn.css +59 -0
  54. data/vendor/assets/stylesheets/animate/rotateInDownLeft.css +62 -0
  55. data/vendor/assets/stylesheets/animate/rotateInDownRight.css +62 -0
  56. data/vendor/assets/stylesheets/animate/rotateInUpLeft.css +62 -0
  57. data/vendor/assets/stylesheets/animate/rotateInUpRight.css +62 -0
  58. data/vendor/assets/stylesheets/animate/rotateOut.css +62 -0
  59. data/vendor/assets/stylesheets/animate/rotateOutDownLeft.css +62 -0
  60. data/vendor/assets/stylesheets/animate/rotateOutDownRight.css +62 -0
  61. data/vendor/assets/stylesheets/animate/rotateOutUpLeft.css +62 -0
  62. data/vendor/assets/stylesheets/animate/rotateOutUpRight.css +62 -0
  63. data/vendor/assets/stylesheets/animate/shake.css +30 -0
  64. data/vendor/assets/stylesheets/animate/swing.css +43 -0
  65. data/vendor/assets/stylesheets/animate/tada.css +38 -0
  66. data/vendor/assets/stylesheets/animate/wiggle.css +67 -0
  67. data/vendor/assets/stylesheets/animate/wobble.css +48 -0
  68. metadata +167 -0
data/vendor/assets/stylesheets/animate/rotateInUpRight.css ADDED
@@ -0,0 +1,62 @@
1
+ @-webkit-keyframes rotateInUpRight {
2
+ 0% {
3
+ -webkit-transform-origin: right bottom;
4
+ -webkit-transform: rotate(-90deg);
5
+ opacity: 0;
6
+ }
7
+
8
+ 100% {
9
+ -webkit-transform-origin: right bottom;
10
+ -webkit-transform: rotate(0);
11
+ opacity: 1;
12
+ }
13
+ }
14
+
15
+ @-moz-keyframes rotateInUpRight {
16
+ 0% {
17
+ -moz-transform-origin: right bottom;
18
+ -moz-transform: rotate(-90deg);
19
+ opacity: 0;
20
+ }
21
+
22
+ 100% {
23
+ -moz-transform-origin: right bottom;
24
+ -moz-transform: rotate(0);
25
+ opacity: 1;
26
+ }
27
+ }
28
+
29
+ @-o-keyframes rotateInUpRight {
30
+ 0% {
31
+ -o-transform-origin: right bottom;
32
+ -o-transform: rotate(-90deg);
33
+ opacity: 0;
34
+ }
35
+
36
+ 100% {
37
+ -o-transform-origin: right bottom;
38
+ -o-transform: rotate(0);
39
+ opacity: 1;
40
+ }
41
+ }
42
+
43
+ @keyframes rotateInUpRight {
44
+ 0% {
45
+ transform-origin: right bottom;
46
+ transform: rotate(-90deg);
47
+ opacity: 0;
48
+ }
49
+
50
+ 100% {
51
+ transform-origin: right bottom;
52
+ transform: rotate(0);
53
+ opacity: 1;
54
+ }
55
+ }
56
+
57
+ .rotateInUpRight {
58
+ -webkit-animation-name: rotateInUpRight;
59
+ -moz-animation-name: rotateInUpRight;
60
+ -o-animation-name: rotateInUpRight;
61
+ animation-name: rotateInUpRight;
62
+ }
data/vendor/assets/stylesheets/animate/rotateOut.css ADDED
@@ -0,0 +1,62 @@
1
+ @-webkit-keyframes rotateOut {
2
+ 0% {
3
+ -webkit-transform-origin: center center;
4
+ -webkit-transform: rotate(0);
5
+ opacity: 1;
6
+ }
7
+
8
+ 100% {
9
+ -webkit-transform-origin: center center;
10
+ -webkit-transform: rotate(200deg);
11
+ opacity: 0;
12
+ }
13
+ }
14
+
15
+ @-moz-keyframes rotateOut {
16
+ 0% {
17
+ -moz-transform-origin: center center;
18
+ -moz-transform: rotate(0);
19
+ opacity: 1;
20
+ }
21
+
22
+ 100% {
23
+ -moz-transform-origin: center center;
24
+ -moz-transform: rotate(200deg);
25
+ opacity: 0;
26
+ }
27
+ }
28
+
29
+ @-o-keyframes rotateOut {
30
+ 0% {
31
+ -o-transform-origin: center center;
32
+ -o-transform: rotate(0);
33
+ opacity: 1;
34
+ }
35
+
36
+ 100% {
37
+ -o-transform-origin: center center;
38
+ -o-transform: rotate(200deg);
39
+ opacity: 0;
40
+ }
41
+ }
42
+
43
+ @keyframes rotateOut {
44
+ 0% {
45
+ transform-origin: center center;
46
+ transform: rotate(0);
47
+ opacity: 1;
48
+ }
49
+
50
+ 100% {
51
+ transform-origin: center center;
52
+ transform: rotate(200deg);
53
+ opacity: 0;
54
+ }
55
+ }
56
+
57
+ .rotateOut {
58
+ -webkit-animation-name: rotateOut;
59
+ -moz-animation-name: rotateOut;
60
+ -o-animation-name: rotateOut;
61
+ animation-name: rotateOut;
62
+ }
data/vendor/assets/stylesheets/animate/rotateOutDownLeft.css ADDED
@@ -0,0 +1,62 @@
1
+ @-webkit-keyframes rotateOutDownLeft {
2
+ 0% {
3
+ -webkit-transform-origin: left bottom;
4
+ -webkit-transform: rotate(0);
5
+ opacity: 1;
6
+ }
7
+
8
+ 100% {
9
+ -webkit-transform-origin: left bottom;
10
+ -webkit-transform: rotate(90deg);
11
+ opacity: 0;
12
+ }
13
+ }
14
+
15
+ @-moz-keyframes rotateOutDownLeft {
16
+ 0% {
17
+ -moz-transform-origin: left bottom;
18
+ -moz-transform: rotate(0);
19
+ opacity: 1;
20
+ }
21
+
22
+ 100% {
23
+ -moz-transform-origin: left bottom;
24
+ -moz-transform: rotate(90deg);
25
+ opacity: 0;
26
+ }
27
+ }
28
+
29
+ @-o-keyframes rotateOutDownLeft {
30
+ 0% {
31
+ -o-transform-origin: left bottom;
32
+ -o-transform: rotate(0);
33
+ opacity: 1;
34
+ }
35
+
36
+ 100% {
37
+ -o-transform-origin: left bottom;
38
+ -o-transform: rotate(90deg);
39
+ opacity: 0;
40
+ }
41
+ }
42
+
43
+ @keyframes rotateOutDownLeft {
44
+ 0% {
45
+ transform-origin: left bottom;
46
+ transform: rotate(0);
47
+ opacity: 1;
48
+ }
49
+
50
+ 100% {
51
+ transform-origin: left bottom;
52
+ transform: rotate(90deg);
53
+ opacity: 0;
54
+ }
55
+ }
56
+
57
+ .rotateOutDownLeft {
58
+ -webkit-animation-name: rotateOutDownLeft;
59
+ -moz-animation-name: rotateOutDownLeft;
60
+ -o-animation-name: rotateOutDownLeft;
61
+ animation-name: rotateOutDownLeft;
62
+ }
data/vendor/assets/stylesheets/animate/rotateOutDownRight.css ADDED
@@ -0,0 +1,62 @@
1
+ @-webkit-keyframes rotateOutDownRight {
2
+ 0% {
3
+ -webkit-transform-origin: right bottom;
4
+ -webkit-transform: rotate(0);
5
+ opacity: 1;
6
+ }
7
+
8
+ 100% {
9
+ -webkit-transform-origin: right bottom;
10
+ -webkit-transform: rotate(-90deg);
11
+ opacity: 0;
12
+ }
13
+ }
14
+
15
+ @-moz-keyframes rotateOutDownRight {
16
+ 0% {
17
+ -moz-transform-origin: right bottom;
18
+ -moz-transform: rotate(0);
19
+ opacity: 1;
20
+ }
21
+
22
+ 100% {
23
+ -moz-transform-origin: right bottom;
24
+ -moz-transform: rotate(-90deg);
25
+ opacity: 0;
26
+ }
27
+ }
28
+
29
+ @-o-keyframes rotateOutDownRight {
30
+ 0% {
31
+ -o-transform-origin: right bottom;
32
+ -o-transform: rotate(0);
33
+ opacity: 1;
34
+ }
35
+
36
+ 100% {
37
+ -o-transform-origin: right bottom;
38
+ -o-transform: rotate(-90deg);
39
+ opacity: 0;
40
+ }
41
+ }
42
+
43
+ @keyframes rotateOutDownRight {
44
+ 0% {
45
+ transform-origin: right bottom;
46
+ transform: rotate(0);
47
+ opacity: 1;
48
+ }
49
+
50
+ 100% {
51
+ transform-origin: right bottom;
52
+ transform: rotate(-90deg);
53
+ opacity: 0;
54
+ }
55
+ }
56
+
57
+ .rotateOutDownRight {
58
+ -webkit-animation-name: rotateOutDownRight;
59
+ -moz-animation-name: rotateOutDownRight;
60
+ -o-animation-name: rotateOutDownRight;
61
+ animation-name: rotateOutDownRight;
62
+ }
data/vendor/assets/stylesheets/animate/rotateOutUpLeft.css ADDED
@@ -0,0 +1,62 @@
1
+ @-webkit-keyframes rotateOutUpLeft {
2
+ 0% {
3
+ -webkit-transform-origin: left bottom;
4
+ -webkit-transform: rotate(0);
5
+ opacity: 1;
6
+ }
7
+
8
+ 100% {
9
+ -webkit-transform-origin: left bottom;
10
+ -webkit-transform: rotate(-90deg);
11
+ opacity: 0;
12
+ }
13
+ }
14
+
15
+ @-moz-keyframes rotateOutUpLeft {
16
+ 0% {
17
+ -moz-transform-origin: left bottom;
18
+ -moz-transform: rotate(0);
19
+ opacity: 1;
20
+ }
21
+
22
+ 100% {
23
+ -moz-transform-origin: left bottom;
24
+ -moz-transform: rotate(-90deg);
25
+ opacity: 0;
26
+ }
27
+ }
28
+
29
+ @-o-keyframes rotateOutUpLeft {
30
+ 0% {
31
+ -o-transform-origin: left bottom;
32
+ -o-transform: rotate(0);
33
+ opacity: 1;
34
+ }
35
+
36
+ 100% {
37
+ -o-transform-origin: left bottom;
38
+ -o-transform: rotate(-90deg);
39
+ opacity: 0;
40
+ }
41
+ }
42
+
43
+ @keyframes rotateOutUpLeft {
44
+ 0% {
45
+ transform-origin: left bottom;
46
+ transform: rotate(0);
47
+ opacity: 1;
48
+ }
49
+
50
+ 100% {
51
+ -transform-origin: left bottom;
52
+ -transform: rotate(-90deg);
53
+ opacity: 0;
54
+ }
55
+ }
56
+
57
+ .rotateOutUpLeft {
58
+ -webkit-animation-name: rotateOutUpLeft;
59
+ -moz-animation-name: rotateOutUpLeft;
60
+ -o-animation-name: rotateOutUpLeft;
61
+ animation-name: rotateOutUpLeft;
62
+ }
data/vendor/assets/stylesheets/animate/rotateOutUpRight.css ADDED
@@ -0,0 +1,62 @@
1
+ @-webkit-keyframes rotateOutUpRight {
2
+ 0% {
3
+ -webkit-transform-origin: right bottom;
4
+ -webkit-transform: rotate(0);
5
+ opacity: 1;
6
+ }
7
+
8
+ 100% {
9
+ -webkit-transform-origin: right bottom;
10
+ -webkit-transform: rotate(90deg);
11
+ opacity: 0;
12
+ }
13
+ }
14
+
15
+ @-moz-keyframes rotateOutUpRight {
16
+ 0% {
17
+ -moz-transform-origin: right bottom;
18
+ -moz-transform: rotate(0);
19
+ opacity: 1;
20
+ }
21
+
22
+ 100% {
23
+ -moz-transform-origin: right bottom;
24
+ -moz-transform: rotate(90deg);
25
+ opacity: 0;
26
+ }
27
+ }
28
+
29
+ @-o-keyframes rotateOutUpRight {
30
+ 0% {
31
+ -o-transform-origin: right bottom;
32
+ -o-transform: rotate(0);
33
+ opacity: 1;
34
+ }
35
+
36
+ 100% {
37
+ -o-transform-origin: right bottom;
38
+ -o-transform: rotate(90deg);
39
+ opacity: 0;
40
+ }
41
+ }
42
+
43
+ @keyframes rotateOutUpRight {
44
+ 0% {
45
+ transform-origin: right bottom;
46
+ transform: rotate(0);
47
+ opacity: 1;
48
+ }
49
+
50
+ 100% {
51
+ transform-origin: right bottom;
52
+ transform: rotate(90deg);
53
+ opacity: 0;
54
+ }
55
+ }
56
+
57
+ .rotateOutUpRight {
58
+ -webkit-animation-name: rotateOutUpRight;
59
+ -moz-animation-name: rotateOutUpRight;
60
+ -o-animation-name: rotateOutUpRight;
61
+ animation-name: rotateOutUpRight;
62
+ }
data/vendor/assets/stylesheets/animate/shake.css ADDED
@@ -0,0 +1,30 @@
1
+ @-webkit-keyframes shake {
2
+ 0%, 100% {-webkit-transform: translateX(0);}
3
+ 10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}
4
+ 20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}
5
+ }
6
+
7
+ @-moz-keyframes shake {
8
+ 0%, 100% {-moz-transform: translateX(0);}
9
+ 10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}
10
+ 20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}
11
+ }
12
+
13
+ @-o-keyframes shake {
14
+ 0%, 100% {-o-transform: translateX(0);}
15
+ 10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}
16
+ 20%, 40%, 60%, 80% {-o-transform: translateX(10px);}
17
+ }
18
+
19
+ @keyframes shake {
20
+ 0%, 100% {transform: translateX(0);}
21
+ 10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
22
+ 20%, 40%, 60%, 80% {transform: translateX(10px);}
23
+ }
24
+
25
+ .shake {
26
+ -webkit-animation-name: shake;
27
+ -moz-animation-name: shake;
28
+ -o-animation-name: shake;
29
+ animation-name: shake;
30
+ }
data/vendor/assets/stylesheets/animate/swing.css ADDED
@@ -0,0 +1,43 @@
1
+ @-webkit-keyframes swing {
2
+ 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; }
3
+ 20% { -webkit-transform: rotate(15deg); }
4
+ 40% { -webkit-transform: rotate(-10deg); }
5
+ 60% { -webkit-transform: rotate(5deg); }
6
+ 80% { -webkit-transform: rotate(-5deg); }
7
+ 100% { -webkit-transform: rotate(0deg); }
8
+ }
9
+
10
+ @-moz-keyframes swing {
11
+ 20% { -moz-transform: rotate(15deg); }
12
+ 40% { -moz-transform: rotate(-10deg); }
13
+ 60% { -moz-transform: rotate(5deg); }
14
+ 80% { -moz-transform: rotate(-5deg); }
15
+ 100% { -moz-transform: rotate(0deg); }
16
+ }
17
+
18
+ @-o-keyframes swing {
19
+ 20% { -o-transform: rotate(15deg); }
20
+ 40% { -o-transform: rotate(-10deg); }
21
+ 60% { -o-transform: rotate(5deg); }
22
+ 80% { -o-transform: rotate(-5deg); }
23
+ 100% { -o-transform: rotate(0deg); }
24
+ }
25
+
26
+ @keyframes swing {
27
+ 20% { transform: rotate(15deg); }
28
+ 40% { transform: rotate(-10deg); }
29
+ 60% { transform: rotate(5deg); }
30
+ 80% { transform: rotate(-5deg); }
31
+ 100% { transform: rotate(0deg); }
32
+ }
33
+
34
+ .swing {
35
+ -webkit-transform-origin: top center;
36
+ -moz-transform-origin: top center;
37
+ -o-transform-origin: top center;
38
+ transform-origin: top center;
39
+ -webkit-animation-name: swing;
40
+ -moz-animation-name: swing;
41
+ -o-animation-name: swing;
42
+ animation-name: swing;
43
+ }