animate-scss 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
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
+ }