Files
ionic-framework/scss/ionic/_animations.scss
2013-10-06 20:39:48 -05:00

39 lines
847 B
SCSS

$bezier-function: cubic-bezier(.1, .7, .1, 1);
.slide-in-up {
// Start hidden
opacity: 0;
// Start it down low
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
-webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
transition: -webkit-transform 0.4s, opacity 0.1s;
-webkit-transition-timing-function: $bezier-function;
transition-timing-function: $bezier-function;
-webkit-animation-fill-mode: forwards;
}
.slide-in-up.active {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
@keyframes fadein {
from { opacity:0.7; }
to { opacity:1; }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
from { opacity:0; }
to { opacity:1; }
}
.fade-in {
opacity: 0;
animation: fadein 0.5s;
-webkit-animation: fadein 0.5s;
}