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/fadeOutUpBig.css ADDED
@@ -0,0 +1,54 @@
1
+ @-webkit-keyframes fadeOutUpBig {
2
+ 0% {
3
+ opacity: 1;
4
+ -webkit-transform: translateY(0);
5
+ }
6
+
7
+ 100% {
8
+ opacity: 0;
9
+ -webkit-transform: translateY(-2000px);
10
+ }
11
+ }
12
+
13
+ @-moz-keyframes fadeOutUpBig {
14
+ 0% {
15
+ opacity: 1;
16
+ -moz-transform: translateY(0);
17
+ }
18
+
19
+ 100% {
20
+ opacity: 0;
21
+ -moz-transform: translateY(-2000px);
22
+ }
23
+ }
24
+
25
+ @-o-keyframes fadeOutUpBig {
26
+ 0% {
27
+ opacity: 1;
28
+ -o-transform: translateY(0);
29
+ }
30
+
31
+ 100% {
32
+ opacity: 0;
33
+ -o-transform: translateY(-2000px);
34
+ }
35
+ }
36
+
37
+ @keyframes fadeOutUpBig {
38
+ 0% {
39
+ opacity: 1;
40
+ transform: translateY(0);
41
+ }
42
+
43
+ 100% {
44
+ opacity: 0;
45
+ transform: translateY(-2000px);
46
+ }
47
+ }
48
+
49
+ .fadeOutUpBig {
50
+ -webkit-animation-name: fadeOutUpBig;
51
+ -moz-animation-name: fadeOutUpBig;
52
+ -o-animation-name: fadeOutUpBig;
53
+ animation-name: fadeOutUpBig;
54
+ }
data/vendor/assets/stylesheets/animate/flash.css ADDED
@@ -0,0 +1,26 @@
1
+ @-webkit-keyframes flash {
2
+ 0%, 50%, 100% {opacity: 1;}
3
+ 25%, 75% {opacity: 0;}
4
+ }
5
+
6
+ @-moz-keyframes flash {
7
+ 0%, 50%, 100% {opacity: 1;}
8
+ 25%, 75% {opacity: 0;}
9
+ }
10
+
11
+ @-o-keyframes flash {
12
+ 0%, 50%, 100% {opacity: 1;}
13
+ 25%, 75% {opacity: 0;}
14
+ }
15
+
16
+ @keyframes flash {
17
+ 0%, 50%, 100% {opacity: 1;}
18
+ 25%, 75% {opacity: 0;}
19
+ }
20
+
21
+ .flash {
22
+ -webkit-animation-name: flash;
23
+ -moz-animation-name: flash;
24
+ -o-animation-name: flash;
25
+ animation-name: flash;
26
+ }
data/vendor/assets/stylesheets/animate/flip.css ADDED
@@ -0,0 +1,103 @@
1
+ @-webkit-keyframes flip {
2
+ 0% {
3
+ -webkit-transform: perspective(400px) rotateY(0);
4
+ -webkit-animation-timing-function: ease-out;
5
+ }
6
+ 40% {
7
+ -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg);
8
+ -webkit-animation-timing-function: ease-out;
9
+ }
10
+ 50% {
11
+ -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
12
+ -webkit-animation-timing-function: ease-in;
13
+ }
14
+ 80% {
15
+ -webkit-transform: perspective(400px) rotateY(360deg) scale(.95);
16
+ -webkit-animation-timing-function: ease-in;
17
+ }
18
+ 100% {
19
+ -webkit-transform: perspective(400px) scale(1);
20
+ -webkit-animation-timing-function: ease-in;
21
+ }
22
+ }
23
+ @-moz-keyframes flip {
24
+ 0% {
25
+ -moz-transform: perspective(400px) rotateY(0);
26
+ -moz-animation-timing-function: ease-out;
27
+ }
28
+ 40% {
29
+ -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg);
30
+ -moz-animation-timing-function: ease-out;
31
+ }
32
+ 50% {
33
+ -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
34
+ -moz-animation-timing-function: ease-in;
35
+ }
36
+ 80% {
37
+ -moz-transform: perspective(400px) rotateY(360deg) scale(.95);
38
+ -moz-animation-timing-function: ease-in;
39
+ }
40
+ 100% {
41
+ -moz-transform: perspective(400px) scale(1);
42
+ -moz-animation-timing-function: ease-in;
43
+ }
44
+ }
45
+ @-o-keyframes flip {
46
+ 0% {
47
+ -o-transform: perspective(400px) rotateY(0);
48
+ -o-animation-timing-function: ease-out;
49
+ }
50
+ 40% {
51
+ -o-transform: perspective(400px) translateZ(150px) rotateY(170deg);
52
+ -o-animation-timing-function: ease-out;
53
+ }
54
+ 50% {
55
+ -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
56
+ -o-animation-timing-function: ease-in;
57
+ }
58
+ 80% {
59
+ -o-transform: perspective(400px) rotateY(360deg) scale(.95);
60
+ -o-animation-timing-function: ease-in;
61
+ }
62
+ 100% {
63
+ -o-transform: perspective(400px) scale(1);
64
+ -o-animation-timing-function: ease-in;
65
+ }
66
+ }
67
+ @keyframes flip {
68
+ 0% {
69
+ transform: perspective(400px) rotateY(0);
70
+ animation-timing-function: ease-out;
71
+ }
72
+ 40% {
73
+ transform: perspective(400px) translateZ(150px) rotateY(170deg);
74
+ animation-timing-function: ease-out;
75
+ }
76
+ 50% {
77
+ transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
78
+ animation-timing-function: ease-in;
79
+ }
80
+ 80% {
81
+ transform: perspective(400px) rotateY(360deg) scale(.95);
82
+ animation-timing-function: ease-in;
83
+ }
84
+ 100% {
85
+ transform: perspective(400px) scale(1);
86
+ animation-timing-function: ease-in;
87
+ }
88
+ }
89
+
90
+ .flip {
91
+ -webkit-transform-style: preserve-3d;
92
+ -moz-transform-style: preserve-3d;
93
+ -o-transform-style: preserve-3d;
94
+ transform-style: preserve-3d;
95
+ -webkit-backface-visibility: visible !important;
96
+ -webkit-animation-name: flip;
97
+ -moz-backface-visibility: visible !important;
98
+ -moz-animation-name: flip;
99
+ -o-backface-visibility: visible !important;
100
+ -o-animation-name: flip;
101
+ backface-visibility: visible !important;
102
+ animation-name: flip;
103
+ }
data/vendor/assets/stylesheets/animate/flipInX.css ADDED
@@ -0,0 +1,87 @@
1
+ @-webkit-keyframes flipInX {
2
+ 0% {
3
+ -webkit-transform: perspective(400px) rotateX(90deg);
4
+ opacity: 0;
5
+ }
6
+
7
+ 40% {
8
+ -webkit-transform: perspective(400px) rotateX(-10deg);
9
+ }
10
+
11
+ 70% {
12
+ -webkit-transform: perspective(400px) rotateX(10deg);
13
+ }
14
+
15
+ 100% {
16
+ -webkit-transform: perspective(400px) rotateX(0deg);
17
+ opacity: 1;
18
+ }
19
+ }
20
+ @-moz-keyframes flipInX {
21
+ 0% {
22
+ -moz-transform: perspective(400px) rotateX(90deg);
23
+ opacity: 0;
24
+ }
25
+
26
+ 40% {
27
+ -moz-transform: perspective(400px) rotateX(-10deg);
28
+ }
29
+
30
+ 70% {
31
+ -moz-transform: perspective(400px) rotateX(10deg);
32
+ }
33
+
34
+ 100% {
35
+ -moz-transform: perspective(400px) rotateX(0deg);
36
+ opacity: 1;
37
+ }
38
+ }
39
+ @-o-keyframes flipInX {
40
+ 0% {
41
+ -o-transform: perspective(400px) rotateX(90deg);
42
+ opacity: 0;
43
+ }
44
+
45
+ 40% {
46
+ -o-transform: perspective(400px) rotateX(-10deg);
47
+ }
48
+
49
+ 70% {
50
+ -o-transform: perspective(400px) rotateX(10deg);
51
+ }
52
+
53
+ 100% {
54
+ -o-transform: perspective(400px) rotateX(0deg);
55
+ opacity: 1;
56
+ }
57
+ }
58
+ @keyframes flipInX {
59
+ 0% {
60
+ transform: perspective(400px) rotateX(90deg);
61
+ opacity: 0;
62
+ }
63
+
64
+ 40% {
65
+ transform: perspective(400px) rotateX(-10deg);
66
+ }
67
+
68
+ 70% {
69
+ transform: perspective(400px) rotateX(10deg);
70
+ }
71
+
72
+ 100% {
73
+ transform: perspective(400px) rotateX(0deg);
74
+ opacity: 1;
75
+ }
76
+ }
77
+
78
+ .flipInX {
79
+ -webkit-backface-visibility: visible !important;
80
+ -webkit-animation-name: flipInX;
81
+ -moz-backface-visibility: visible !important;
82
+ -moz-animation-name: flipInX;
83
+ -o-backface-visibility: visible !important;
84
+ -o-animation-name: flipInX;
85
+ backface-visibility: visible !important;
86
+ animation-name: flipInX;
87
+ }
data/vendor/assets/stylesheets/animate/flipInY.css ADDED
@@ -0,0 +1,87 @@
1
+ @-webkit-keyframes flipInY {
2
+ 0% {
3
+ -webkit-transform: perspective(400px) rotateY(90deg);
4
+ opacity: 0;
5
+ }
6
+
7
+ 40% {
8
+ -webkit-transform: perspective(400px) rotateY(-10deg);
9
+ }
10
+
11
+ 70% {
12
+ -webkit-transform: perspective(400px) rotateY(10deg);
13
+ }
14
+
15
+ 100% {
16
+ -webkit-transform: perspective(400px) rotateY(0deg);
17
+ opacity: 1;
18
+ }
19
+ }
20
+ @-moz-keyframes flipInY {
21
+ 0% {
22
+ -moz-transform: perspective(400px) rotateY(90deg);
23
+ opacity: 0;
24
+ }
25
+
26
+ 40% {
27
+ -moz-transform: perspective(400px) rotateY(-10deg);
28
+ }
29
+
30
+ 70% {
31
+ -moz-transform: perspective(400px) rotateY(10deg);
32
+ }
33
+
34
+ 100% {
35
+ -moz-transform: perspective(400px) rotateY(0deg);
36
+ opacity: 1;
37
+ }
38
+ }
39
+ @-o-keyframes flipInY {
40
+ 0% {
41
+ -o-transform: perspective(400px) rotateY(90deg);
42
+ opacity: 0;
43
+ }
44
+
45
+ 40% {
46
+ -o-transform: perspective(400px) rotateY(-10deg);
47
+ }
48
+
49
+ 70% {
50
+ -o-transform: perspective(400px) rotateY(10deg);
51
+ }
52
+
53
+ 100% {
54
+ -o-transform: perspective(400px) rotateY(0deg);
55
+ opacity: 1;
56
+ }
57
+ }
58
+ @keyframes flipInY {
59
+ 0% {
60
+ transform: perspective(400px) rotateY(90deg);
61
+ opacity: 0;
62
+ }
63
+
64
+ 40% {
65
+ transform: perspective(400px) rotateY(-10deg);
66
+ }
67
+
68
+ 70% {
69
+ transform: perspective(400px) rotateY(10deg);
70
+ }
71
+
72
+ 100% {
73
+ transform: perspective(400px) rotateY(0deg);
74
+ opacity: 1;
75
+ }
76
+ }
77
+
78
+ .flipInY {
79
+ -webkit-backface-visibility: visible !important;
80
+ -webkit-animation-name: flipInY;
81
+ -moz-backface-visibility: visible !important;
82
+ -moz-animation-name: flipInY;
83
+ -o-backface-visibility: visible !important;
84
+ -o-animation-name: flipInY;
85
+ backface-visibility: visible !important;
86
+ animation-name: flipInY;
87
+ }
data/vendor/assets/stylesheets/animate/flipOutX.css ADDED
@@ -0,0 +1,54 @@
1
+ @-webkit-keyframes flipOutX {
2
+ 0% {
3
+ -webkit-transform: perspective(400px) rotateX(0deg);
4
+ opacity: 1;
5
+ }
6
+ 100% {
7
+ -webkit-transform: perspective(400px) rotateX(90deg);
8
+ opacity: 0;
9
+ }
10
+ }
11
+
12
+ @-moz-keyframes flipOutX {
13
+ 0% {
14
+ -moz-transform: perspective(400px) rotateX(0deg);
15
+ opacity: 1;
16
+ }
17
+ 100% {
18
+ -moz-transform: perspective(400px) rotateX(90deg);
19
+ opacity: 0;
20
+ }
21
+ }
22
+
23
+ @-o-keyframes flipOutX {
24
+ 0% {
25
+ -o-transform: perspective(400px) rotateX(0deg);
26
+ opacity: 1;
27
+ }
28
+ 100% {
29
+ -o-transform: perspective(400px) rotateX(90deg);
30
+ opacity: 0;
31
+ }
32
+ }
33
+
34
+ @keyframes flipOutX {
35
+ 0% {
36
+ transform: perspective(400px) rotateX(0deg);
37
+ opacity: 1;
38
+ }
39
+ 100% {
40
+ transform: perspective(400px) rotateX(90deg);
41
+ opacity: 0;
42
+ }
43
+ }
44
+
45
+ .flipOutX {
46
+ -webkit-animation-name: flipOutX;
47
+ -webkit-backface-visibility: visible !important;
48
+ -moz-animation-name: flipOutX;
49
+ -moz-backface-visibility: visible !important;
50
+ -o-animation-name: flipOutX;
51
+ -o-backface-visibility: visible !important;
52
+ animation-name: flipOutX;
53
+ backface-visibility: visible !important;
54
+ }
data/vendor/assets/stylesheets/animate/flipOutY.css ADDED
@@ -0,0 +1,51 @@
1
+ @-webkit-keyframes flipOutY {
2
+ 0% {
3
+ -webkit-transform: perspective(400px) rotateY(0deg);
4
+ opacity: 1;
5
+ }
6
+ 100% {
7
+ -webkit-transform: perspective(400px) rotateY(90deg);
8
+ opacity: 0;
9
+ }
10
+ }
11
+ @-moz-keyframes flipOutY {
12
+ 0% {
13
+ -moz-transform: perspective(400px) rotateY(0deg);
14
+ opacity: 1;
15
+ }
16
+ 100% {
17
+ -moz-transform: perspective(400px) rotateY(90deg);
18
+ opacity: 0;
19
+ }
20
+ }
21
+ @-o-keyframes flipOutY {
22
+ 0% {
23
+ -o-transform: perspective(400px) rotateY(0deg);
24
+ opacity: 1;
25
+ }
26
+ 100% {
27
+ -o-transform: perspective(400px) rotateY(90deg);
28
+ opacity: 0;
29
+ }
30
+ }
31
+ @keyframes flipOutY {
32
+ 0% {
33
+ transform: perspective(400px) rotateY(0deg);
34
+ opacity: 1;
35
+ }
36
+ 100% {
37
+ transform: perspective(400px) rotateY(90deg);
38
+ opacity: 0;
39
+ }
40
+ }
41
+
42
+ .flipOutY {
43
+ -webkit-backface-visibility: visible !important;
44
+ -webkit-animation-name: flipOutY;
45
+ -moz-backface-visibility: visible !important;
46
+ -moz-animation-name: flipOutY;
47
+ -o-backface-visibility: visible !important;
48
+ -o-animation-name: flipOutY;
49
+ backface-visibility: visible !important;
50
+ animation-name: flipOutY;
51
+ }