Files
ionic-framework/scss/ionic/_animations.scss
2013-10-04 17:47:54 -05:00

45 lines
983 B
SCSS

$bezier-function: cubic-bezier(.1, .7, .1, 1);
/*
.slide-in-up.enter {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
-webkit-transition: -webkit-transform .25s ease-in-out, opacity 1ms .25s;
transition: transform .25s ease-in-out, opacity 1ms .25s;
}
*/
@-webkit-keyframes slide-in-up {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slide-in-up.active {
animation: slide-in-up 0.5s;
-webkit-animation: slide-in-up 0.5s;
-webkit-animation-timing-function: $bezier-function;
}
@keyframes fadein {
from { opacity:0; }
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;
}