sammy 0.0.1.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/README.md +4 -0
- data/lib/sammy.rb +9 -0
- data/stylesheets/_sammy.sass +3 -0
- data/stylesheets/sammy/_animations.scss +35 -0
- data/stylesheets/sammy/_css3.scss +3 -0
- data/stylesheets/sammy/_shared.scss +2 -0
- data/stylesheets/sammy/_utilities.scss +1 -0
- data/stylesheets/sammy/animations/_attention-seekers.scss +7 -0
- data/stylesheets/sammy/animations/_bouncing-entrances.scss +5 -0
- data/stylesheets/sammy/animations/_bouncing-exits.scss +5 -0
- data/stylesheets/sammy/animations/_fading-entrances.scss +12 -0
- data/stylesheets/sammy/animations/_fading-exits.scss +12 -0
- data/stylesheets/sammy/animations/_flippers.scss +5 -0
- data/stylesheets/sammy/animations/_rotating-entrances.scss +5 -0
- data/stylesheets/sammy/animations/_rotating-exits.scss +5 -0
- data/stylesheets/sammy/animations/_specials.scss +3 -0
- data/stylesheets/sammy/animations/attention-seekers/_bounce.scss +30 -0
- data/stylesheets/sammy/animations/attention-seekers/_flash.scss +28 -0
- data/stylesheets/sammy/animations/attention-seekers/_pulse.scss +28 -0
- data/stylesheets/sammy/animations/attention-seekers/_shake.scss +34 -0
- data/stylesheets/sammy/animations/attention-seekers/_swing.scss +30 -0
- data/stylesheets/sammy/animations/attention-seekers/_tada.scss +34 -0
- data/stylesheets/sammy/animations/attention-seekers/_wobble.scss +32 -0
- data/stylesheets/sammy/animations/bouncing-entrances/_bounceIn.scss +37 -0
- data/stylesheets/sammy/animations/bouncing-entrances/_bounceInDown.scss +37 -0
- data/stylesheets/sammy/animations/bouncing-entrances/_bounceInLeft.scss +37 -0
- data/stylesheets/sammy/animations/bouncing-entrances/_bounceInRight.scss +37 -0
- data/stylesheets/sammy/animations/bouncing-entrances/_bounceInUp.scss +37 -0
- data/stylesheets/sammy/animations/bouncing-exits/_bounceOut.scss +37 -0
- data/stylesheets/sammy/animations/bouncing-exits/_bounceOutDown.scss +34 -0
- data/stylesheets/sammy/animations/bouncing-exits/_bounceOutLeft.scss +34 -0
- data/stylesheets/sammy/animations/bouncing-exits/_bounceOutRight.scss +34 -0
- data/stylesheets/sammy/animations/bouncing-exits/_bounceOutUp.scss +34 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeIn.scss +25 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInDown.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInDownBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInLeft.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInLeftBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInRight.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInRightBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInUp.scss +31 -0
- data/stylesheets/sammy/animations/fading-entrances/_fadeInUpBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOut.scss +25 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutDown.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutDownBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutLeft.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutLeftBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutRight.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutRightBig.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutUp.scss +31 -0
- data/stylesheets/sammy/animations/fading-exits/_fadeOutUpBig.scss +31 -0
- data/stylesheets/sammy/animations/flippers/_flip.scss +44 -0
- data/stylesheets/sammy/animations/flippers/_flipInX.scss +38 -0
- data/stylesheets/sammy/animations/flippers/_flipInY.scss +38 -0
- data/stylesheets/sammy/animations/flippers/_flipOutX.scss +32 -0
- data/stylesheets/sammy/animations/flippers/_flipOutY.scss +32 -0
- data/stylesheets/sammy/animations/rotating-entrances/_rotateIn.scss +33 -0
- data/stylesheets/sammy/animations/rotating-entrances/_rotateInDownLeft.scss +33 -0
- data/stylesheets/sammy/animations/rotating-entrances/_rotateInDownRight.scss +33 -0
- data/stylesheets/sammy/animations/rotating-entrances/_rotateInUpLeft.scss +33 -0
- data/stylesheets/sammy/animations/rotating-entrances/_rotateInUpRight.scss +33 -0
- data/stylesheets/sammy/animations/rotating-exits/_rotateOut.scss +33 -0
- data/stylesheets/sammy/animations/rotating-exits/_rotateOutDownLeft.scss +33 -0
- data/stylesheets/sammy/animations/rotating-exits/_rotateOutDownRight.scss +33 -0
- data/stylesheets/sammy/animations/rotating-exits/_rotateOutUpLeft.scss +33 -0
- data/stylesheets/sammy/animations/rotating-exits/_rotateOutUpRight.scss +33 -0
- data/stylesheets/sammy/animations/specials/_hinge.scss +48 -0
- data/stylesheets/sammy/animations/specials/_rollIn.scss +33 -0
- data/stylesheets/sammy/animations/specials/_rollOut.scss +33 -0
- data/stylesheets/sammy/css3/_animation.scss +75 -0
- data/stylesheets/sammy/css3/_backface-visibility.scss +14 -0
- data/stylesheets/sammy/css3/_transform.scss +27 -0
- data/stylesheets/sammy/css3/animation/_animation-delay.scss +18 -0
- data/stylesheets/sammy/css3/animation/_animation-direction.scss +18 -0
- data/stylesheets/sammy/css3/animation/_animation-duration.scss +17 -0
- data/stylesheets/sammy/css3/animation/_animation-fill-mode.scss +18 -0
- data/stylesheets/sammy/css3/animation/_animation-iteration-count.scss +18 -0
- data/stylesheets/sammy/css3/animation/_animation-name.scss +18 -0
- data/stylesheets/sammy/css3/animation/_animation-play-state.scss +18 -0
- data/stylesheets/sammy/css3/animation/_animation-timing-function.scss +18 -0
- data/stylesheets/sammy/utilities/_mixins.scss +12 -0
- data/templates/sammy/manifest.rb +2 -0
- data/templates/sammy/screen.scss +2 -0
- metadata +140 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA1:
|
3
|
+
metadata.gz: 1b8c3cce084c248346fc48af0828a2f7f0492b79
|
4
|
+
data.tar.gz: 33ff14f7e6cf5e1d058fc6360b57c3a5e11c1f80
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 52127a426582efb416f51ecc90f61e4784793a097d0d691b81dde571290f8efcf0ca86e89367c6aa5e1be1f87f2d19986972d5e4e58b4499a13cc20e4e5b0b12
|
7
|
+
data.tar.gz: 793289d5dbaf3985ddef955c24294392f14122f6fdc0052fe1bd532c836769514a74737867e0b621b7ad415a1e1607c706eed7db1edaf885a08c6ace485186d7
|
data/README.md
ADDED
data/lib/sammy.rb
ADDED
@@ -0,0 +1,35 @@
|
|
1
|
+
// Attention seekers
|
2
|
+
// flash bounce shake tada swing wobble pulse
|
3
|
+
@import "animations/attention-seekers";
|
4
|
+
|
5
|
+
// Fading entrances
|
6
|
+
// fadeIn fadeInUp fadeInDown fadeInLeft fadeInRight fadeInUpBig fadeInDownBig fadeInLeftBig fadeInRightBig
|
7
|
+
@import "animations/fading-entrances";
|
8
|
+
|
9
|
+
// Fading exits
|
10
|
+
// fadeOut fadeOutUp fadeOutDown fadeOutLeft fadeOutRight fadeOutUpBig fadeOutDownBig fadeOutLeftBig fadeOutRightBig
|
11
|
+
@import "animations/fading-exits";
|
12
|
+
|
13
|
+
// Bouncing entrances
|
14
|
+
// bounceIn bounceInDown bounceInUp bounceInLeft bounceInRight
|
15
|
+
@import "animations/bouncing-entrances";
|
16
|
+
|
17
|
+
// Bouncing exits
|
18
|
+
// bounceOut bounceOutDown bounceOutUp bounceOutLeft bounceOutRight
|
19
|
+
@import "animations/bouncing-exits";
|
20
|
+
|
21
|
+
// Rotating entrances
|
22
|
+
// rotateIn rotateInDownLeft rotateInDownRight rotateInUpLeft rotateInUpRight
|
23
|
+
@import "animations/rotating-entrances";
|
24
|
+
|
25
|
+
// Rotating exits
|
26
|
+
// rotateOut rotateOutDownLeft rotateOutDownRight rotateOutUpLeft rotateOutUpRight
|
27
|
+
@import "animations/rotating-exits";
|
28
|
+
|
29
|
+
// Specials
|
30
|
+
// hinge rollIn rollOut
|
31
|
+
@import "animations/specials";
|
32
|
+
|
33
|
+
// Flippers
|
34
|
+
// flip flipInX flipOutX flipInY flipOutY
|
35
|
+
@import "animations/flippers";
|
@@ -0,0 +1 @@
|
|
1
|
+
@import "utilities/mixins";
|
@@ -0,0 +1,12 @@
|
|
1
|
+
// Normal
|
2
|
+
@import "fading-entrances/fadeIn";
|
3
|
+
@import "fading-entrances/fadeInUp";
|
4
|
+
@import "fading-entrances/fadeInDown";
|
5
|
+
@import "fading-entrances/fadeInLeft";
|
6
|
+
@import "fading-entrances/fadeInRight";
|
7
|
+
|
8
|
+
// Big
|
9
|
+
@import "fading-entrances/fadeInUpBig";
|
10
|
+
@import "fading-entrances/fadeInDownBig";
|
11
|
+
@import "fading-entrances/fadeInLeftBig";
|
12
|
+
@import "fading-entrances/fadeInRightBig";
|
@@ -0,0 +1,12 @@
|
|
1
|
+
// Normal
|
2
|
+
@import "fading-exits/fadeOut";
|
3
|
+
@import "fading-exits/fadeOutUp";
|
4
|
+
@import "fading-exits/fadeOutDown";
|
5
|
+
@import "fading-exits/fadeOutLeft";
|
6
|
+
@import "fading-exits/fadeOutRight";
|
7
|
+
|
8
|
+
// Big
|
9
|
+
@import "fading-exits/fadeOutUpBig";
|
10
|
+
@import "fading-exits/fadeOutDownBig";
|
11
|
+
@import "fading-exits/fadeOutLeftBig";
|
12
|
+
@import "fading-exits/fadeOutRightBig";
|
@@ -0,0 +1,30 @@
|
|
1
|
+
@mixin bounce($prefix) {
|
2
|
+
0% { @include transform(translateY(0), $prefix); }
|
3
|
+
20% { @include transform(translateY(0), $prefix); }
|
4
|
+
40% { @include transform(translateY(-30px), $prefix); }
|
5
|
+
50% { @include transform(translateY(0), $prefix); }
|
6
|
+
60% { @include transform(translateY(-15px), $prefix); }
|
7
|
+
80% { @include transform(translateY(0), $prefix); }
|
8
|
+
100% { @include transform(translateY(0), $prefix); }
|
9
|
+
}
|
10
|
+
|
11
|
+
@if $experimental-support-for-webkit {
|
12
|
+
@-webkit-keyframes bounce { @include bounce(webkit); }
|
13
|
+
}
|
14
|
+
@if $experimental-support-for-khtml {
|
15
|
+
@-khtml-keyframes bounce { @include bounce(khtml); }
|
16
|
+
}
|
17
|
+
@if $experimental-support-for-mozilla {
|
18
|
+
@-moz-keyframes bounce { @include bounce(moz); }
|
19
|
+
}
|
20
|
+
@if $experimental-support-for-microsoft {
|
21
|
+
@-ms-keyframes bounce { @include bounce(ms); }
|
22
|
+
}
|
23
|
+
@if $experimental-support-for-opera {
|
24
|
+
@-o-keyframes bounce { @include bounce(o); }
|
25
|
+
}
|
26
|
+
@keyframes bounce { @include bounce(none); }
|
27
|
+
|
28
|
+
.bounce {
|
29
|
+
@include animation-name(bounce);
|
30
|
+
}
|
@@ -0,0 +1,28 @@
|
|
1
|
+
@mixin flash {
|
2
|
+
0% { opacity: 1; }
|
3
|
+
25% { opacity: 0; }
|
4
|
+
50% { opacity: 1; }
|
5
|
+
75% { opacity: 0; }
|
6
|
+
100% { opacity: 1; }
|
7
|
+
}
|
8
|
+
|
9
|
+
@if $experimental-support-for-webkit {
|
10
|
+
@-webkit-keyframes flash { @include flash; }
|
11
|
+
}
|
12
|
+
@if $experimental-support-for-khtml {
|
13
|
+
@-khtml-keyframes flash { @include flash; }
|
14
|
+
}
|
15
|
+
@if $experimental-support-for-mozilla {
|
16
|
+
@-moz-keyframes flash { @include flash; }
|
17
|
+
}
|
18
|
+
@if $experimental-support-for-microsoft {
|
19
|
+
@-ms-keyframes flash { @include flash; }
|
20
|
+
}
|
21
|
+
@if $experimental-support-for-opera {
|
22
|
+
@-o-keyframes flash { @include flash; }
|
23
|
+
}
|
24
|
+
@keyframes flash { @include flash; }
|
25
|
+
|
26
|
+
.flash {
|
27
|
+
@include animation-name(flash);
|
28
|
+
}
|
@@ -0,0 +1,28 @@
|
|
1
|
+
// Originally authored by Nick Pettit - https://github.com/nickpettit/glide
|
2
|
+
|
3
|
+
@mixin pulse($prefix) {
|
4
|
+
0% { @include transform(scale(1), $prefix); }
|
5
|
+
50% { @include transform(scale(1.1), $prefix); }
|
6
|
+
100% { @include transform(scale(1), $prefix); }
|
7
|
+
}
|
8
|
+
|
9
|
+
@if $experimental-support-for-webkit {
|
10
|
+
@-webkit-keyframes pulse { @include pulse(webkit); }
|
11
|
+
}
|
12
|
+
@if $experimental-support-for-khtml {
|
13
|
+
@-khtml-keyframes pulse { @include pulse(khtml); }
|
14
|
+
}
|
15
|
+
@if $experimental-support-for-mozilla {
|
16
|
+
@-moz-keyframes pulse { @include pulse(moz); }
|
17
|
+
}
|
18
|
+
@if $experimental-support-for-microsoft {
|
19
|
+
@-ms-keyframes pulse { @include pulse(ms); }
|
20
|
+
}
|
21
|
+
@if $experimental-support-for-opera {
|
22
|
+
@-o-keyframes pulse { @include pulse(o); }
|
23
|
+
}
|
24
|
+
@keyframes pulse { @include pulse(none); }
|
25
|
+
|
26
|
+
.pulse {
|
27
|
+
@include animation-name(pulse);
|
28
|
+
}
|
@@ -0,0 +1,34 @@
|
|
1
|
+
@mixin shake($prefix) {
|
2
|
+
0% { @include transform(translateX(0), $prefix); }
|
3
|
+
10% { @include transform(translateX(-10px), $prefix); }
|
4
|
+
20% { @include transform(translateX(10px), $prefix); }
|
5
|
+
30% { @include transform(translateX(-10px), $prefix); }
|
6
|
+
40% { @include transform(translateX(10px), $prefix); }
|
7
|
+
50% { @include transform(translateX(-10px), $prefix); }
|
8
|
+
60% { @include transform(translateX(10px), $prefix); }
|
9
|
+
70% { @include transform(translateX(-10px), $prefix); }
|
10
|
+
80% { @include transform(translateX(10px), $prefix); }
|
11
|
+
90% { @include transform(translateX(-10px), $prefix); }
|
12
|
+
100% { @include transform(translateX(0), $prefix); }
|
13
|
+
}
|
14
|
+
|
15
|
+
@if $experimental-support-for-webkit {
|
16
|
+
@-webkit-keyframes shake { @include shake(webkit); }
|
17
|
+
}
|
18
|
+
@if $experimental-support-for-khtml {
|
19
|
+
@-khtml-keyframes shake { @include shake(khtml); }
|
20
|
+
}
|
21
|
+
@if $experimental-support-for-mozilla {
|
22
|
+
@-moz-keyframes shake { @include shake(moz); }
|
23
|
+
}
|
24
|
+
@if $experimental-support-for-microsoft {
|
25
|
+
@-ms-keyframes shake { @include shake(ms); }
|
26
|
+
}
|
27
|
+
@if $experimental-support-for-opera {
|
28
|
+
@-o-keyframes shake { @include shake(o); }
|
29
|
+
}
|
30
|
+
@keyframes shake { @include shake(none); }
|
31
|
+
|
32
|
+
.shake {
|
33
|
+
@include animation-name(shake);
|
34
|
+
}
|
@@ -0,0 +1,30 @@
|
|
1
|
+
@mixin swing($prefix) {
|
2
|
+
20%, 40%, 60%, 80%, 100% { @include transform-origin(top center, $prefix); }
|
3
|
+
20% { @include transform(rotate(15deg), $prefix); }
|
4
|
+
40% { @include transform(rotate(-10deg), $prefix); }
|
5
|
+
60% { @include transform(rotate(5deg), $prefix); }
|
6
|
+
80% { @include transform(rotate(-5deg), $prefix); }
|
7
|
+
100% { @include transform(rotate(0deg), $prefix); }
|
8
|
+
}
|
9
|
+
|
10
|
+
@if $experimental-support-for-webkit {
|
11
|
+
@-webkit-keyframes swing { @include swing(webkit); }
|
12
|
+
}
|
13
|
+
@if $experimental-support-for-khtml {
|
14
|
+
@-khtml-keyframes swing { @include swing(khtml); }
|
15
|
+
}
|
16
|
+
@if $experimental-support-for-mozilla {
|
17
|
+
@-moz-keyframes swing { @include swing(moz); }
|
18
|
+
}
|
19
|
+
@if $experimental-support-for-microsoft {
|
20
|
+
@-ms-keyframes swing { @include swing(ms); }
|
21
|
+
}
|
22
|
+
@if $experimental-support-for-opera {
|
23
|
+
@-o-keyframes swing { @include swing(o); }
|
24
|
+
}
|
25
|
+
@keyframes swing { @include swing(none); }
|
26
|
+
|
27
|
+
.swing {
|
28
|
+
@include transform-origin(top center);
|
29
|
+
@include animation-name(swing);
|
30
|
+
}
|
@@ -0,0 +1,34 @@
|
|
1
|
+
@mixin tada($prefix) {
|
2
|
+
0% { @include transform(scale(1), $prefix); }
|
3
|
+
10% { @include transform(scale(0.9) rotate(-3deg), $prefix); }
|
4
|
+
20% { @include transform(scale(0.9) rotate(-3deg), $prefix); }
|
5
|
+
30% { @include transform(scale(1.1) rotate(3deg), $prefix); }
|
6
|
+
40% { @include transform(scale(1.1) rotate(-3deg), $prefix); }
|
7
|
+
50% { @include transform(scale(1.1) rotate(3deg), $prefix); }
|
8
|
+
60% { @include transform(scale(1.1) rotate(-3deg), $prefix); }
|
9
|
+
70% { @include transform(scale(1.1) rotate(3deg), $prefix); }
|
10
|
+
80% { @include transform(scale(1.1) rotate(-3deg), $prefix); }
|
11
|
+
90% { @include transform(scale(1.1) rotate(3deg), $prefix); }
|
12
|
+
100% { @include transform(scale(1) rotate(0), $prefix); }
|
13
|
+
}
|
14
|
+
|
15
|
+
@if $experimental-support-for-webkit {
|
16
|
+
@-webkit-keyframes tada { @include tada(webkit); }
|
17
|
+
}
|
18
|
+
@if $experimental-support-for-khtml {
|
19
|
+
@-khtml-keyframes tada { @include tada(khtml); }
|
20
|
+
}
|
21
|
+
@if $experimental-support-for-mozilla {
|
22
|
+
@-moz-keyframes tada { @include tada(moz); }
|
23
|
+
}
|
24
|
+
@if $experimental-support-for-microsoft {
|
25
|
+
@-ms-keyframes tada { @include tada(ms); }
|
26
|
+
}
|
27
|
+
@if $experimental-support-for-opera {
|
28
|
+
@-o-keyframes tada { @include tada(o); }
|
29
|
+
}
|
30
|
+
@keyframes tada { @include tada(none); }
|
31
|
+
|
32
|
+
.tada {
|
33
|
+
@include animation-name(tada);
|
34
|
+
}
|
@@ -0,0 +1,32 @@
|
|
1
|
+
// Originally authored by Nick Pettit - https://github.com/nickpettit/glide
|
2
|
+
|
3
|
+
@mixin wobble($prefix) {
|
4
|
+
0% { @include transform(translateX(0%), $prefix); }
|
5
|
+
15% { @include transform(translateX(-25%) rotate(-5deg), $prefix); }
|
6
|
+
30% { @include transform(translateX(20%) rotate(3deg), $prefix); }
|
7
|
+
45% { @include transform(translateX(-15%) rotate(-3deg), $prefix); }
|
8
|
+
60% { @include transform(translateX(10%) rotate(2deg), $prefix); }
|
9
|
+
75% { @include transform(translateX(-5%) rotate(-1deg), $prefix); }
|
10
|
+
100% { @include transform(translateX(0%), $prefix); }
|
11
|
+
}
|
12
|
+
|
13
|
+
@if $experimental-support-for-webkit {
|
14
|
+
@-webkit-keyframes wobble { @include wobble(webkit); }
|
15
|
+
}
|
16
|
+
@if $experimental-support-for-khtml {
|
17
|
+
@-khtml-keyframes wobble { @include wobble(khtml); }
|
18
|
+
}
|
19
|
+
@if $experimental-support-for-mozilla {
|
20
|
+
@-moz-keyframes wobble { @include wobble(moz); }
|
21
|
+
}
|
22
|
+
@if $experimental-support-for-microsoft {
|
23
|
+
@-ms-keyframes wobble { @include wobble(ms); }
|
24
|
+
}
|
25
|
+
@if $experimental-support-for-opera {
|
26
|
+
@-o-keyframes wobble { @include wobble(o); }
|
27
|
+
}
|
28
|
+
@keyframes wobble { @include wobble(none); }
|
29
|
+
|
30
|
+
.wobble {
|
31
|
+
@include animation-name(wobble);
|
32
|
+
}
|
@@ -0,0 +1,37 @@
|
|
1
|
+
@mixin bounceIn($prefix) {
|
2
|
+
0% {
|
3
|
+
opacity: 0;
|
4
|
+
@include transform(scale(0.3), $prefix);
|
5
|
+
}
|
6
|
+
50% {
|
7
|
+
opacity: 1;
|
8
|
+
@include transform(scale(1.05), $prefix);
|
9
|
+
}
|
10
|
+
70% {
|
11
|
+
@include transform(scale(0.9), $prefix);
|
12
|
+
}
|
13
|
+
100% {
|
14
|
+
@include transform(scale(1), $prefix);
|
15
|
+
}
|
16
|
+
}
|
17
|
+
|
18
|
+
@if $experimental-support-for-webkit {
|
19
|
+
@-webkit-keyframes bounceIn { @include bounceIn(webkit); }
|
20
|
+
}
|
21
|
+
@if $experimental-support-for-khtml {
|
22
|
+
@-khtml-keyframes bounceIn { @include bounceIn(khtml); }
|
23
|
+
}
|
24
|
+
@if $experimental-support-for-mozilla {
|
25
|
+
@-moz-keyframes bounceIn { @include bounceIn(moz); }
|
26
|
+
}
|
27
|
+
@if $experimental-support-for-microsoft {
|
28
|
+
@-ms-keyframes bounceIn { @include bounceIn(ms); }
|
29
|
+
}
|
30
|
+
@if $experimental-support-for-opera {
|
31
|
+
@-o-keyframes bounceIn { @include bounceIn(o); }
|
32
|
+
}
|
33
|
+
@keyframes bounceIn { @include bounceIn(none); }
|
34
|
+
|
35
|
+
.bounceIn {
|
36
|
+
@include animation-name(bounceIn);
|
37
|
+
}
|
@@ -0,0 +1,37 @@
|
|
1
|
+
@mixin bounceInDown($prefix) {
|
2
|
+
0% {
|
3
|
+
opacity: 0;
|
4
|
+
@include transform(translateY(-2000px), $prefix);
|
5
|
+
}
|
6
|
+
60% {
|
7
|
+
opacity: 1;
|
8
|
+
@include transform(translateY(30px), $prefix);
|
9
|
+
}
|
10
|
+
80% {
|
11
|
+
@include transform(translateY(-10px), $prefix);
|
12
|
+
}
|
13
|
+
100% {
|
14
|
+
@include transform(translateY(0), $prefix);
|
15
|
+
}
|
16
|
+
}
|
17
|
+
|
18
|
+
@if $experimental-support-for-webkit {
|
19
|
+
@-webkit-keyframes bounceInDown { @include bounceInDown(webkit); }
|
20
|
+
}
|
21
|
+
@if $experimental-support-for-khtml {
|
22
|
+
@-khtml-keyframes bounceInDown { @include bounceInDown(khtml); }
|
23
|
+
}
|
24
|
+
@if $experimental-support-for-mozilla {
|
25
|
+
@-moz-keyframes bounceInDown { @include bounceInDown(moz); }
|
26
|
+
}
|
27
|
+
@if $experimental-support-for-microsoft {
|
28
|
+
@-ms-keyframes bounceInDown { @include bounceInDown(ms); }
|
29
|
+
}
|
30
|
+
@if $experimental-support-for-opera {
|
31
|
+
@-o-keyframes bounceInDown { @include bounceInDown(o); }
|
32
|
+
}
|
33
|
+
@keyframes bounceInDown { @include bounceInDown(none); }
|
34
|
+
|
35
|
+
.bounceInDown {
|
36
|
+
@include animation-name(bounceInDown);
|
37
|
+
}
|