animate.sass-rails 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.
- data/MIT-LICENSE +20 -0
- data/README.md +26 -0
- data/Rakefile +26 -0
- data/lib/animate.sass-rails.rb +6 -0
- data/lib/animate.sass-rails/version.rb +3 -0
- data/vendor/assets/stylesheets/_animate.sass +7 -0
- data/vendor/assets/stylesheets/animate/_animations.sass +35 -0
- data/vendor/assets/stylesheets/animate/_css3.sass +3 -0
- data/vendor/assets/stylesheets/animate/_shared.sass +2 -0
- data/vendor/assets/stylesheets/animate/_utilities.sass +1 -0
- data/vendor/assets/stylesheets/animate/animations/_attention-seekers.sass +7 -0
- data/vendor/assets/stylesheets/animate/animations/_bouncing-entrances.sass +5 -0
- data/vendor/assets/stylesheets/animate/animations/_bouncing-exits.sass +5 -0
- data/vendor/assets/stylesheets/animate/animations/_fading-entrances.sass +12 -0
- data/vendor/assets/stylesheets/animate/animations/_fading-exits.sass +12 -0
- data/vendor/assets/stylesheets/animate/animations/_flippers.sass +5 -0
- data/vendor/assets/stylesheets/animate/animations/_rotating-entrances.sass +5 -0
- data/vendor/assets/stylesheets/animate/animations/_rotating-exits.sass +5 -0
- data/vendor/assets/stylesheets/animate/animations/_specials.sass +3 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_bounce.sass +42 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_flash.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_pulse.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_shake.sass +50 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_swing.sass +41 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_tada.sass +50 -0
- data/vendor/assets/stylesheets/animate/animations/attention-seekers/_wobble.sass +44 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-entrances/_bounceIn.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-entrances/_bounceInDown.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-entrances/_bounceInLeft.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-entrances/_bounceInRight.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-entrances/_bounceInUp.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-exits/_bounceOut.sass +38 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-exits/_bounceOutDown.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-exits/_bounceOutLeft.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-exits/_bounceOutRight.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/bouncing-exits/_bounceOutUp.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeIn.sass +32 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInDown.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInDownBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInLeft.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInLeftBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInRight.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInRightBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInUp.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-entrances/_fadeInUpBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOut.sass +32 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutDown.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutDownBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutLeft.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutLeftBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutRight.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutRightBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutUp.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/fading-exits/_fadeOutUpBig.sass +34 -0
- data/vendor/assets/stylesheets/animate/animations/flippers/_flip.sass +44 -0
- data/vendor/assets/stylesheets/animate/animations/flippers/_flipInX.sass +39 -0
- data/vendor/assets/stylesheets/animate/animations/flippers/_flipInY.sass +39 -0
- data/vendor/assets/stylesheets/animate/animations/flippers/_flipOutX.sass +35 -0
- data/vendor/assets/stylesheets/animate/animations/flippers/_flipOutY.sass +35 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-entrances/_rotateIn.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-entrances/_rotateInDownLeft.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-entrances/_rotateInDownRight.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-entrances/_rotateInUpLeft.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-entrances/_rotateInUpRight.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-exits/_rotateOut.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-exits/_rotateOutDownLeft.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-exits/_rotateOutDownRight.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-exits/_rotateOutUpLeft.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/rotating-exits/_rotateOutUpRight.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/specials/_hinge.sass +48 -0
- data/vendor/assets/stylesheets/animate/animations/specials/_rollIn.sass +36 -0
- data/vendor/assets/stylesheets/animate/animations/specials/_rollOut.sass +36 -0
- data/vendor/assets/stylesheets/animate/css3/_animation.sass +49 -0
- data/vendor/assets/stylesheets/animate/css3/_backface-visibility.sass +8 -0
- data/vendor/assets/stylesheets/animate/css3/_transform.sass +19 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-delay.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-direction.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-duration.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-fill-mode.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-iteration-count.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-name.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-play-state.sass +10 -0
- data/vendor/assets/stylesheets/animate/css3/animation/_animation-timing-function.sass +10 -0
- data/vendor/assets/stylesheets/animate/utilities/_mixins.sass +7 -0
- metadata +146 -0
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateInUpLeft($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(left bottom, $prefix)
|
|
4
|
+
+transform(rotate(90deg), $prefix)
|
|
5
|
+
opacity: 0
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(left bottom, $prefix)
|
|
8
|
+
+transform(rotate(0), $prefix)
|
|
9
|
+
opacity: 1
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateInUpLeft
|
|
13
|
+
+rotateInUpLeft(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateInUpLeft
|
|
17
|
+
+rotateInUpLeft(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateInUpLeft
|
|
21
|
+
+rotateInUpLeft(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateInUpLeft
|
|
25
|
+
+rotateInUpLeft(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateInUpLeft
|
|
29
|
+
+rotateInUpLeft(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateInUpLeft
|
|
32
|
+
+rotateInUpLeft(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateInUpLeft
|
|
36
|
+
+animation-name(rotateInUpLeft)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateInUpRight($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(right bottom, $prefix)
|
|
4
|
+
+transform(rotate(-90deg), $prefix)
|
|
5
|
+
opacity: 0
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(right bottom, $prefix)
|
|
8
|
+
+transform(rotate(0), $prefix)
|
|
9
|
+
opacity: 1
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateInUpRight
|
|
13
|
+
+rotateInUpRight(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateInUpRight
|
|
17
|
+
+rotateInUpRight(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateInUpRight
|
|
21
|
+
+rotateInUpRight(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateInUpRight
|
|
25
|
+
+rotateInUpRight(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateInUpRight
|
|
29
|
+
+rotateInUpRight(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateInUpRight
|
|
32
|
+
+rotateInUpRight(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateInUpRight
|
|
36
|
+
+animation-name(rotateInUpRight)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateOut($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(center center, $prefix)
|
|
4
|
+
+transform(rotate(0), $prefix)
|
|
5
|
+
opacity: 1
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(center center, $prefix)
|
|
8
|
+
+transform(rotate(200deg), $prefix)
|
|
9
|
+
opacity: 0
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateOut
|
|
13
|
+
+rotateOut(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateOut
|
|
17
|
+
+rotateOut(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateOut
|
|
21
|
+
+rotateOut(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateOut
|
|
25
|
+
+rotateOut(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateOut
|
|
29
|
+
+rotateOut(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateOut
|
|
32
|
+
+rotateOut(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateOut
|
|
36
|
+
+animation-name(rotateOut)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateOutDownLeft($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(left bottom, $prefix)
|
|
4
|
+
+transform(rotate(0), $prefix)
|
|
5
|
+
opacity: 1
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(left bottom, $prefix)
|
|
8
|
+
+transform(rotate(90deg), $prefix)
|
|
9
|
+
opacity: 0
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateOutDownLeft
|
|
13
|
+
+rotateOutDownLeft(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateOutDownLeft
|
|
17
|
+
+rotateOutDownLeft(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateOutDownLeft
|
|
21
|
+
+rotateOutDownLeft(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateOutDownLeft
|
|
25
|
+
+rotateOutDownLeft(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateOutDownLeft
|
|
29
|
+
+rotateOutDownLeft(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateOutDownLeft
|
|
32
|
+
+rotateOutDownLeft(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateOutDownLeft
|
|
36
|
+
+animation-name(rotateOutDownLeft)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateOutDownRight($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(right bottom, $prefix)
|
|
4
|
+
+transform(rotate(0), $prefix)
|
|
5
|
+
opacity: 1
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(right bottom, $prefix)
|
|
8
|
+
+transform(rotate(-90deg), $prefix)
|
|
9
|
+
opacity: 0
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateOutDownRight
|
|
13
|
+
+rotateOutDownRight(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateOutDownRight
|
|
17
|
+
+rotateOutDownRight(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateOutDownRight
|
|
21
|
+
+rotateOutDownRight(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateOutDownRight
|
|
25
|
+
+rotateOutDownRight(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateOutDownRight
|
|
29
|
+
+rotateOutDownRight(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateOutDownRight
|
|
32
|
+
+rotateOutDownRight(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateOutDownRight
|
|
36
|
+
+animation-name(rotateOutDownRight)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateOutUpLeft($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(left bottom, $prefix)
|
|
4
|
+
+transform(rotate(0), $prefix)
|
|
5
|
+
opacity: 1
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(left bottom, $prefix)
|
|
8
|
+
+transform(rotate(-90deg), $prefix)
|
|
9
|
+
opacity: 0
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateOutUpLeft
|
|
13
|
+
+rotateOutUpLeft(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateOutUpLeft
|
|
17
|
+
+rotateOutUpLeft(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateOutUpLeft
|
|
21
|
+
+rotateOutUpLeft(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateOutUpLeft
|
|
25
|
+
+rotateOutUpLeft(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateOutUpLeft
|
|
29
|
+
+rotateOutUpLeft(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateOutUpLeft
|
|
32
|
+
+rotateOutUpLeft(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateOutUpLeft
|
|
36
|
+
+animation-name(rotateOutUpLeft)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
=rotateOutUpRight($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+transform-origin(right bottom, $prefix)
|
|
4
|
+
+transform(rotate(0), $prefix)
|
|
5
|
+
opacity: 1
|
|
6
|
+
100%
|
|
7
|
+
+transform-origin(right bottom, $prefix)
|
|
8
|
+
+transform(rotate(90deg), $prefix)
|
|
9
|
+
opacity: 0
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rotateOutUpRight
|
|
13
|
+
+rotateOutUpRight(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rotateOutUpRight
|
|
17
|
+
+rotateOutUpRight(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rotateOutUpRight
|
|
21
|
+
+rotateOutUpRight(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rotateOutUpRight
|
|
25
|
+
+rotateOutUpRight(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rotateOutUpRight
|
|
29
|
+
+rotateOutUpRight(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rotateOutUpRight
|
|
32
|
+
+rotateOutUpRight(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rotateOutUpRight
|
|
36
|
+
+animation-name(rotateOutUpRight)
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
=hinge($prefix)
|
|
2
|
+
0%
|
|
3
|
+
+animation-timing-function(ease-in-out, $prefix)
|
|
4
|
+
+transform(rotate(0), $prefix)
|
|
5
|
+
+transform-origin(top left, $prefix)
|
|
6
|
+
20%, 60%
|
|
7
|
+
+animation-timing-function(ease-in-out, $prefix)
|
|
8
|
+
+transform(rotate(80deg), $prefix)
|
|
9
|
+
+transform-origin(top left, $prefix)
|
|
10
|
+
40%
|
|
11
|
+
+transform(rotate(60deg), $prefix)
|
|
12
|
+
+transform-origin(top left, $prefix)
|
|
13
|
+
+animation-timing-function(ease-in-out, $prefix)
|
|
14
|
+
80%
|
|
15
|
+
opacity: 1
|
|
16
|
+
+animation-timing-function(ease-in-out, $prefix)
|
|
17
|
+
+transform(rotate(60deg) translateY(0), $prefix)
|
|
18
|
+
+transform-origin(top left, $prefix)
|
|
19
|
+
100%
|
|
20
|
+
+transform(translateY(700px), $prefix)
|
|
21
|
+
opacity: 0
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-webkit
|
|
24
|
+
@-webkit-keyframes hinge
|
|
25
|
+
+hinge(webkit)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-khtml
|
|
28
|
+
@-khtml-keyframes hinge
|
|
29
|
+
+hinge(khtml)
|
|
30
|
+
|
|
31
|
+
@if $experimental-support-for-mozilla
|
|
32
|
+
@-moz-keyframes hinge
|
|
33
|
+
+hinge(moz)
|
|
34
|
+
|
|
35
|
+
@if $experimental-support-for-microsoft
|
|
36
|
+
@-ms-keyframes hinge
|
|
37
|
+
+hinge(ms)
|
|
38
|
+
|
|
39
|
+
@if $experimental-support-for-opera
|
|
40
|
+
@-o-keyframes hinge
|
|
41
|
+
+hinge(o)
|
|
42
|
+
|
|
43
|
+
@keyframes hinge
|
|
44
|
+
+hinge(none)
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
.hinge
|
|
48
|
+
+animation-name(hinge)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// Originally authored by Nick Pettit - https://github.com/nickpettit/glide
|
|
2
|
+
|
|
3
|
+
=rollIn($prefix)
|
|
4
|
+
0%
|
|
5
|
+
opacity: 0
|
|
6
|
+
+transform(translateX(-100%) rotate(-120deg), $prefix)
|
|
7
|
+
100%
|
|
8
|
+
opacity: 1
|
|
9
|
+
+transform(translateX(0px) rotate(0deg), $prefix)
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rollIn
|
|
13
|
+
+rollIn(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rollIn
|
|
17
|
+
+rollIn(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rollIn
|
|
21
|
+
+rollIn(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rollIn
|
|
25
|
+
+rollIn(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rollIn
|
|
29
|
+
+rollIn(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rollIn
|
|
32
|
+
+rollIn(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rollIn
|
|
36
|
+
+animation-name(rollIn)
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
// Originally authored by Nick Pettit - https://github.com/nickpettit/glide
|
|
2
|
+
|
|
3
|
+
=rollOut($prefix)
|
|
4
|
+
0%
|
|
5
|
+
opacity: 1
|
|
6
|
+
+transform(translateX(0px) rotate(0deg), $prefix)
|
|
7
|
+
100%
|
|
8
|
+
opacity: 0
|
|
9
|
+
+transform(translateX(100%) rotate(120deg), $prefix)
|
|
10
|
+
|
|
11
|
+
@if $experimental-support-for-webkit
|
|
12
|
+
@-webkit-keyframes rollOut
|
|
13
|
+
+rollOut(webkit)
|
|
14
|
+
|
|
15
|
+
@if $experimental-support-for-khtml
|
|
16
|
+
@-khtml-keyframes rollOut
|
|
17
|
+
+rollOut(khtml)
|
|
18
|
+
|
|
19
|
+
@if $experimental-support-for-mozilla
|
|
20
|
+
@-moz-keyframes rollOut
|
|
21
|
+
+rollOut(moz)
|
|
22
|
+
|
|
23
|
+
@if $experimental-support-for-microsoft
|
|
24
|
+
@-ms-keyframes rollOut
|
|
25
|
+
+rollOut(ms)
|
|
26
|
+
|
|
27
|
+
@if $experimental-support-for-opera
|
|
28
|
+
@-o-keyframes rollOut
|
|
29
|
+
+rollOut(o)
|
|
30
|
+
|
|
31
|
+
@keyframes rollOut
|
|
32
|
+
+rollOut(none)
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
.rollOut
|
|
36
|
+
+animation-name(rollOut)
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
// Pulled from Bourbon ~ SHA: 93beb25236
|
|
2
|
+
// Bourbon ~ https://github.com/thoughtbot/bourbon
|
|
3
|
+
|
|
4
|
+
// CSS3 Animations - http://www.w3.org/TR/css3-animations/
|
|
5
|
+
//
|
|
6
|
+
// Each of these mixins support comma separated lists of values, which
|
|
7
|
+
// allows different transitions for individual properties to be described
|
|
8
|
+
// in a single style rule. Each value in the list corresponds to the value
|
|
9
|
+
// at that same position in the other properties.
|
|
10
|
+
|
|
11
|
+
@import animation/animation-name
|
|
12
|
+
@import animation/animation-duration
|
|
13
|
+
@import animation/animation-timing-function
|
|
14
|
+
@import animation/animation-iteration-count
|
|
15
|
+
@import animation/animation-direction
|
|
16
|
+
@import animation/animation-play-state
|
|
17
|
+
@import animation/animation-delay
|
|
18
|
+
@import animation/animation-fill-mode
|
|
19
|
+
|
|
20
|
+
// Shorthand for a basic animation. Supports multiple parentheses-deliminated values for each variable.
|
|
21
|
+
// Example: @include animation-basic((slideup, fadein), (1.0s, 2.0s), ease-in);
|
|
22
|
+
|
|
23
|
+
=animation-basic($name, $time: 0, $motion: ease)
|
|
24
|
+
$length-of-name: length($name)
|
|
25
|
+
$length-of-time: length($time)
|
|
26
|
+
$length-of-motion: length($motion)
|
|
27
|
+
@if $length-of-name > 1
|
|
28
|
+
+animation-name(zip($name))
|
|
29
|
+
@else
|
|
30
|
+
+animation-name($name)
|
|
31
|
+
@if $length-of-time > 1
|
|
32
|
+
+animation-duration(zip($time))
|
|
33
|
+
@else
|
|
34
|
+
+animation-duration($time)
|
|
35
|
+
@if $length-of-motion > 1
|
|
36
|
+
+animation-timing-function(zip($motion))
|
|
37
|
+
@else
|
|
38
|
+
+animation-timing-function($motion)
|
|
39
|
+
|
|
40
|
+
// Official animation shorthand property. Needs more work to actually be useful.
|
|
41
|
+
// Spec - http://www.w3.org/TR/css3-animations/#animation
|
|
42
|
+
// Values: name duration timing-function delay iteration-count direction
|
|
43
|
+
|
|
44
|
+
=animation($name: fadeIn, $duration: 1s, $timing-function: ease, $delay: 0.2s, $iteration-count: 1, $direction: normal, $prefix: false)
|
|
45
|
+
$value: $name $duration $timing-function $delay $iteration-count $direction
|
|
46
|
+
@if $prefix
|
|
47
|
+
+declaration(animation, $value, $prefix)
|
|
48
|
+
@else
|
|
49
|
+
+experimental(animation, $value)
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
// animation-delay - http://www.w3.org/TR/css3-animations/#the-animation-delay-property-
|
|
2
|
+
|
|
3
|
+
=backface-visibility($value: visible, $prefix: false)
|
|
4
|
+
// <time>
|
|
5
|
+
@if $prefix
|
|
6
|
+
+declaration(backface-visibility, $value, $prefix)
|
|
7
|
+
@else
|
|
8
|
+
+experimental(backface-visibility, $value)
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
// transform - https://developer.mozilla.org/en/CSS/transform
|
|
2
|
+
// none | <transform-function>
|
|
3
|
+
|
|
4
|
+
=transform($value: none, $prefix: false)
|
|
5
|
+
@if $prefix
|
|
6
|
+
+declaration(transform, $value, $prefix)
|
|
7
|
+
@else
|
|
8
|
+
+experimental(transform, $value)
|
|
9
|
+
|
|
10
|
+
// transform-origin - https://developer.mozilla.org/en/CSS/transform-origin
|
|
11
|
+
// x-axis - left | center | right | length | %
|
|
12
|
+
// y-axis - top | center | bottom | length | %
|
|
13
|
+
// z-axis - length
|
|
14
|
+
|
|
15
|
+
=transform-origin($value: 50%, $prefix: false)
|
|
16
|
+
@if $prefix
|
|
17
|
+
+declaration(transform-origin, $value, $prefix)
|
|
18
|
+
@else
|
|
19
|
+
+experimental(transform-origin, $value)
|