All Downloads are FREE. Search and download functionalities are using the official Maven repository.
Many resources are needed to download a project. Please understand that we have to compensate our server costs. Thank you in advance.
Project price only 1 $
You can buy this project and download/modify it how often you want.
css.libs.angularjs.angular-motion.css Maven / Gradle / Ivy
/**
* angular-motion
* @version v0.4.4 - 2016-03-31
* @link http://mgcrea.github.io/angular-motion
* @author Olivier Louvignes (https://github.com/mgcrea)
* @license MIT License, http://www.opensource.org/licenses/MIT
*/
.am-collapse {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
overflow: hidden;
opacity: 1;
}
.am-collapse.am-collapse-add,
.am-collapse.ng-hide-remove,
.am-collapse.ng-move {
-webkit-animation-name: expand;
animation-name: expand;
}
.am-collapse.am-collapse-remove,
.am-collapse.ng-hide {
-webkit-animation-name: collapse;
animation-name: collapse;
}
.am-collapse.ng-enter {
visibility: hidden;
-webkit-animation-name: expand;
animation-name: expand;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-collapse.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-collapse.ng-leave {
-webkit-animation-name: collapse;
animation-name: collapse;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-collapse.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes expand {
from {
max-height: 0px;
}
to {
max-height: 500px;
}
}
@keyframes expand {
from {
max-height: 0px;
}
to {
max-height: 500px;
}
}
@-webkit-keyframes collapse {
from {
max-height: 500px;
}
to {
max-height: 0px;
}
}
@keyframes collapse {
from {
max-height: 500px;
}
to {
max-height: 0px;
}
}
.card-collapse.am-collapse.in-remove {
-webkit-animation-name: collapse;
animation-name: collapse;
display: block;
}
.card-collapse.am-collapse.in-add {
-webkit-animation-name: expand;
animation-name: expand;
}
.am-fade {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
opacity: 1;
}
.am-fade.am-fade-add,
.am-fade.ng-hide-remove,
.am-fade.ng-move {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
.am-fade.am-fade-remove,
.am-fade.ng-hide {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
.am-fade.ng-enter {
visibility: hidden;
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade.ng-leave {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
.tab-pane.am-fade.active-remove {
display: none !important;
}
.tab-pane.am-fade.active-add {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
.modal-backdrop.am-fade,
.aside-backdrop.am-fade {
background: rgba(0, 0, 0, 0.5);
-webkit-animation-duration: 0.15s;
animation-duration: 0.15s;
}
.am-fade-and-scale {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-fade-and-scale.ng-enter,
.am-fade-and-scale.am-fade-and-scale-add,
.am-fade-and-scale.ng-hide-remove,
.am-fade-and-scale.ng-move {
-webkit-animation-name: fadeAndScaleIn;
animation-name: fadeAndScaleIn;
}
.am-fade-and-scale.ng-leave,
.am-fade-and-scale.am-fade-and-scale-remove,
.am-fade-and-scale.ng-hide {
-webkit-animation-name: fadeAndScaleOut;
animation-name: fadeAndScaleOut;
}
.am-fade-and-scale.ng-enter {
visibility: hidden;
-webkit-animation-name: fadeAndScaleIn;
animation-name: fadeAndScaleIn;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-scale.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-scale.ng-leave {
-webkit-animation-name: fadeAndScaleOut;
animation-name: fadeAndScaleOut;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-scale.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes fadeAndScaleIn {
from {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
to {
opacity: 1;
}
}
@keyframes fadeAndScaleIn {
from {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeAndScaleOut {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
@keyframes fadeAndScaleOut {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
}
.am-fade-and-slide-top {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-fade-and-slide-top.am-fade-and-slide-top-add,
.am-fade-and-slide-top.ng-hide-remove,
.am-fade-and-slide-top.ng-move {
-webkit-animation-name: fadeAndSlideFromTop;
animation-name: fadeAndSlideFromTop;
}
.am-fade-and-slide-top.am-fade-and-slide-top-remove,
.am-fade-and-slide-top.ng-hide {
-webkit-animation-name: fadeAndSlideToTop;
animation-name: fadeAndSlideToTop;
}
.am-fade-and-slide-top.ng-enter {
visibility: hidden;
-webkit-animation-name: fadeAndSlideFromTop;
animation-name: fadeAndSlideFromTop;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-top.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-top.ng-leave {
-webkit-animation-name: fadeAndSlideToTop;
animation-name: fadeAndSlideToTop;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-top.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-right {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-fade-and-slide-right.am-fade-and-slide-right-add,
.am-fade-and-slide-right.ng-hide-remove,
.am-fade-and-slide-right.ng-move {
-webkit-animation-name: fadeAndSlideFromRight;
animation-name: fadeAndSlideFromRight;
}
.am-fade-and-slide-right.am-fade-and-slide-right-remove,
.am-fade-and-slide-right.ng-hide {
-webkit-animation-name: fadeAndSlideToRight;
animation-name: fadeAndSlideToRight;
}
.am-fade-and-slide-right.ng-enter {
visibility: hidden;
-webkit-animation-name: fadeAndSlideFromRight;
animation-name: fadeAndSlideFromRight;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-right.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-right.ng-leave {
-webkit-animation-name: fadeAndSlideToRight;
animation-name: fadeAndSlideToRight;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-right.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-bottom {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-fade-and-slide-bottom.am-fade-and-slide-bottom-add,
.am-fade-and-slide-bottom.ng-hide-remove,
.am-fade-and-slide-bottom.ng-move {
-webkit-animation-name: fadeAndSlideFromBottom;
animation-name: fadeAndSlideFromBottom;
}
.am-fade-and-slide-bottom.am-fade-and-slide-bottom-remove,
.am-fade-and-slide-bottom.ng-hide {
-webkit-animation-name: fadeAndSlideToBottom;
animation-name: fadeAndSlideToBottom;
}
.am-fade-and-slide-bottom.ng-enter {
visibility: hidden;
-webkit-animation-name: fadeAndSlideFromBottom;
animation-name: fadeAndSlideFromBottom;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-bottom.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-bottom.ng-leave {
-webkit-animation-name: fadeAndSlideToBottom;
animation-name: fadeAndSlideToBottom;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-bottom.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-left {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-fade-and-slide-left.am-fade-and-slide-left-add,
.am-fade-and-slide-left.ng-hide-remove,
.am-fade-and-slide-left.ng-move {
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
-webkit-animation-name: fadeAndSlideFromLeft;
animation-name: fadeAndSlideFromLeft;
}
.am-fade-and-slide-left.am-fade-and-slide-left-remove,
.am-fade-and-slide-left.ng-hide {
-webkit-animation-name: fadeAndSlideToLeft;
animation-name: fadeAndSlideToLeft;
}
.am-fade-and-slide-left.ng-enter {
visibility: hidden;
-webkit-animation-name: fadeAndSlideFromLeft;
animation-name: fadeAndSlideFromLeft;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-left.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-fade-and-slide-left.ng-leave {
-webkit-animation-name: fadeAndSlideToLeft;
animation-name: fadeAndSlideToLeft;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-fade-and-slide-left.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes fadeAndSlideFromTop {
from {
opacity: 0;
-webkit-transform: translateY(-20%);
transform: translateY(-20%);
}
to {
opacity: 1;
}
}
@keyframes fadeAndSlideFromTop {
from {
opacity: 0;
-webkit-transform: translateY(-20%);
transform: translateY(-20%);
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeAndSlideToTop {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateY(-20%);
transform: translateY(-20%);
}
}
@keyframes fadeAndSlideToTop {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateY(-20%);
transform: translateY(-20%);
}
}
@-webkit-keyframes fadeAndSlideFromRight {
from {
opacity: 0;
-webkit-transform: translateX(20%);
transform: translateX(20%);
}
to {
opacity: 1;
}
}
@keyframes fadeAndSlideFromRight {
from {
opacity: 0;
-webkit-transform: translateX(20%);
transform: translateX(20%);
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeAndSlideToRight {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateX(20%);
transform: translateX(20%);
}
}
@keyframes fadeAndSlideToRight {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateX(20%);
transform: translateX(20%);
}
}
@-webkit-keyframes fadeAndSlideFromBottom {
from {
opacity: 0;
-webkit-transform: translateY(20%);
transform: translateY(20%);
}
to {
opacity: 1;
}
}
@keyframes fadeAndSlideFromBottom {
from {
opacity: 0;
-webkit-transform: translateY(20%);
transform: translateY(20%);
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeAndSlideToBottom {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateY(20%);
transform: translateY(20%);
}
}
@keyframes fadeAndSlideToBottom {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateY(20%);
transform: translateY(20%);
}
}
@-webkit-keyframes fadeAndSlideFromLeft {
from {
opacity: 0;
-webkit-transform: translateX(-20%);
transform: translateX(-20%);
}
to {
opacity: 1;
}
}
@keyframes fadeAndSlideFromLeft {
from {
opacity: 0;
-webkit-transform: translateX(-20%);
transform: translateX(-20%);
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeAndSlideToLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateX(-20%);
transform: translateX(-20%);
}
}
@keyframes fadeAndSlideToLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateX(-20%);
transform: translateX(-20%);
}
}
.am-flip-x {
-webkit-animation-duration: 0.4s;
animation-duration: 0.4s;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-flip-x.am-flip-x-add,
.am-flip-x.ng-hide-remove,
.am-flip-x.ng-move {
-webkit-animation-name: flipInXBounce;
animation-name: flipInXBounce;
}
.am-flip-x.am-flip-x-remove,
.am-flip-x.ng-hide {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
}
.am-flip-x.ng-enter {
visibility: hidden;
-webkit-animation-name: flipInXBounce;
animation-name: flipInXBounce;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-flip-x.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-flip-x.ng-leave {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-flip-x.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-flip-x-linear {
-webkit-animation-duration: 0.4s;
animation-duration: 0.4s;
-webkit-animation-timing-function: ease;
animation-timing-function: ease;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-flip-x-linear.am-flip-x-add,
.am-flip-x-linear.ng-hide-remove,
.am-flip-x-linear.ng-move {
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
.am-flip-x-linear.am-flip-x-remove,
.am-flip-x-linear.ng-hide {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
}
.am-flip-x-linear.ng-enter {
visibility: hidden;
-webkit-animation-name: flipInX;
animation-name: flipInX;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-flip-x-linear.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-flip-x-linear.ng-leave {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-flip-x-linear.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes flipInX {
from {
opacity: 0;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
}
to {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
}
}
@keyframes flipInX {
from {
opacity: 0;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
}
to {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
}
}
@-webkit-keyframes flipInXBounce {
from {
opacity: 0;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
}
to {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
}
}
@keyframes flipInXBounce {
from {
opacity: 0;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
}
40% {
-webkit-transform: perspective(400px) rotateX(-10deg);
transform: perspective(400px) rotateX(-10deg);
}
70% {
-webkit-transform: perspective(400px) rotateX(10deg);
transform: perspective(400px) rotateX(10deg);
}
to {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
}
}
@-webkit-keyframes flipOutX {
from {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
}
to {
opacity: 0;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
}
}
@keyframes flipOutX {
from {
opacity: 1;
-webkit-transform: perspective(400px) rotateX(0deg);
transform: perspective(400px) rotateX(0deg);
}
to {
opacity: 0;
-webkit-transform: perspective(400px) rotateX(90deg);
transform: perspective(400px) rotateX(90deg);
}
}
.am-slide-top {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-slide-top.am-slide-top-add,
.am-slide-top.ng-hide-remove,
.am-slide-top.ng-move {
-webkit-animation-name: slideFromTop;
animation-name: slideFromTop;
}
.am-slide-top.am-slide-top-remove,
.am-slide-top.ng-hide {
-webkit-animation-name: slideToTop;
animation-name: slideToTop;
}
.am-slide-top.ng-enter {
visibility: hidden;
-webkit-animation-name: slideFromTop;
animation-name: slideFromTop;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-top.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-top.ng-leave {
-webkit-animation-name: slideToTop;
animation-name: slideToTop;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-top.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-right {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-slide-right.am-slide-right-add,
.am-slide-right.ng-hide-remove,
.am-slide-right.ng-move {
-webkit-animation-name: slideFromRight;
animation-name: slideFromRight;
}
.am-slide-right.am-slide-right-remove,
.am-slide-right.ng-hide {
-webkit-animation-name: slideToRight;
animation-name: slideToRight;
}
.am-slide-right.ng-enter {
visibility: hidden;
-webkit-animation-name: slideFromRight;
animation-name: slideFromRight;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-right.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-right.ng-leave {
-webkit-animation-name: slideToRight;
animation-name: slideToRight;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-right.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-bottom {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-slide-bottom.am-slide-bottom-add,
.am-slide-bottom.ng-hide-remove,
.am-slide-bottom.ng-move {
-webkit-animation-name: slideFromBottom;
animation-name: slideFromBottom;
}
.am-slide-bottom.am-slide-bottom-remove,
.am-slide-bottom.ng-hide {
-webkit-animation-name: slideToBottom;
animation-name: slideToBottom;
}
.am-slide-bottom.ng-enter {
visibility: hidden;
-webkit-animation-name: slideFromBottom;
animation-name: slideFromBottom;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-bottom.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-bottom.ng-leave {
-webkit-animation-name: slideToBottom;
animation-name: slideToBottom;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-bottom.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-left {
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
}
.am-slide-left.am-slide-left-add,
.am-slide-left.ng-hide-remove,
.am-slide-left.ng-move {
-webkit-animation-name: slideFromLeft;
animation-name: slideFromLeft;
}
.am-slide-left.am-slide-left-remove,
.am-slide-left.ng-hide {
-webkit-animation-name: slideToLeft;
animation-name: slideToLeft;
}
.am-slide-left.ng-enter {
visibility: hidden;
-webkit-animation-name: slideFromLeft;
animation-name: slideFromLeft;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-left.ng-enter.ng-enter-active {
visibility: visible;
-webkit-animation-play-state: running;
animation-play-state: running;
}
.am-slide-left.ng-leave {
-webkit-animation-name: slideToLeft;
animation-name: slideToLeft;
-webkit-animation-play-state: paused;
animation-play-state: paused;
}
.am-slide-left.ng-leave.ng-leave-active {
-webkit-animation-play-state: running;
animation-play-state: running;
}
@-webkit-keyframes slideFromTop {
from {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@keyframes slideFromTop {
from {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes slideToTop {
to {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@keyframes slideToTop {
to {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@-webkit-keyframes slideFromRight {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes slideFromRight {
from {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes slideToRight {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@keyframes slideToRight {
to {
-webkit-transform: translateX(100%);
transform: translateX(100%);
}
}
@-webkit-keyframes slideFromBottom {
from {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@keyframes slideFromBottom {
from {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes slideToBottom {
to {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@keyframes slideToBottom {
to {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
}
@-webkit-keyframes slideFromLeft {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes slideFromLeft {
from {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@-webkit-keyframes slideToLeft {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes slideToLeft {
to {
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
