|
|
// Slide up from the bottom, used for modals
|
|
// -------------------------------
|
|
|
|
.slide-in-up {
|
|
@include translate3d(0, 100%, 0);
|
|
}
|
|
.slide-in-up.ng-enter,
|
|
.slide-in-up > .ng-enter {
|
|
@include transition(all cubic-bezier(.1, .7, .1, 1) 400ms);
|
|
}
|
|
.slide-in-up.ng-enter-active,
|
|
.slide-in-up > .ng-enter-active {
|
|
@include translate3d(0, 0, 0);
|
|
}
|
|
|
|
.slide-in-up.ng-leave,
|
|
.slide-in-up > .ng-leave {
|
|
@include transition(all ease-in-out 250ms);
|
|
}
|
|
|
|
|
|
// Scale Out
|
|
// Scale from hero (1 in this case) to zero
|
|
// -------------------------------
|
|
|
|
@-webkit-keyframes scaleOut {
|
|
from { -webkit-transform: scale(1); opacity: 1; }
|
|
to { -webkit-transform: scale(0.8); opacity: 0; }
|
|
}
|
|
@keyframes scaleOut {
|
|
from { transform: scale(1); opacity: 1; }
|
|
to { transform: scale(0.8); opacity: 0; }
|
|
}
|
|
|
|
|
|
// Super Scale In
|
|
// Scale from super (1.x) to duper (1 in this case)
|
|
// -------------------------------
|
|
|
|
@-webkit-keyframes superScaleIn {
|
|
from { -webkit-transform: scale(1.2); opacity: 0; }
|
|
to { -webkit-transform: scale(1); opacity: 1 }
|
|
}
|
|
@keyframes superScaleIn {
|
|
from { transform: scale(1.2); opacity: 0; }
|
|
to { transform: scale(1); opacity: 1; }
|
|
}
|