update motion animation-name

pull/297/head
jljsj 10 years ago
parent 8a8790831a
commit 872b215930

@ -40,12 +40,12 @@
} }
&-fade-enter&-fade-enter-active { &-fade-enter&-fade-enter-active {
animation-name: fadeIn; animation-name: antFadeIn;
animation-play-state: running; animation-play-state: running;
} }
&-fade-leave&-fade-leave-active { &-fade-leave&-fade-leave-active {
animation-name: fadeOut; animation-name: antFadeOut;
animation-play-state: running; animation-play-state: running;
} }
} }

@ -12,16 +12,16 @@
} }
.fade-enter.fade-enter-active, .fade-appear.fade-appear-active { .fade-enter.fade-enter-active, .fade-appear.fade-appear-active {
animation-name: fadeIn; animation-name: antFadeIn;
animation-play-state: running; animation-play-state: running;
} }
.fade-leave.fade-leave-active { .fade-leave.fade-leave-active {
animation-name: fadeOut; animation-name: antFadeOut;
animation-play-state: running; animation-play-state: running;
} }
@keyframes fadeIn { @keyframes antFadeIn {
0% { 0% {
opacity: 0; opacity: 0;
} }
@ -30,7 +30,7 @@
} }
} }
@keyframes fadeOut { @keyframes antFadeOut {
0% { 0% {
opacity: 1; opacity: 1;
} }

@ -9,12 +9,12 @@
} }
} }
.move-motion(move-up, moveUp); .move-motion(move-up, antMoveUp);
.move-motion(move-down, moveDown); .move-motion(move-down, antMoveDown);
.move-motion(move-left, moveLeft); .move-motion(move-left, antMoveLeft);
.move-motion(move-right, moveRight); .move-motion(move-right, antMoveRight);
@keyframes moveDownIn { @keyframes antMoveDownIn {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateY(100%); transform: translateY(100%);
@ -27,7 +27,7 @@
} }
} }
@keyframes moveDownOut { @keyframes antMoveDownOut {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateY(0%); transform: translateY(0%);
@ -40,7 +40,7 @@
} }
} }
@keyframes moveLeftIn { @keyframes antMoveLeftIn {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateX(-100%); transform: translateX(-100%);
@ -53,7 +53,7 @@
} }
} }
@keyframes moveLeftOut { @keyframes antMoveLeftOut {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateX(0%); transform: translateX(0%);
@ -66,7 +66,7 @@
} }
} }
@keyframes moveRightIn { @keyframes antMoveRightIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 0 0; transform-origin: 0 0;
@ -79,7 +79,7 @@
} }
} }
@keyframes moveRightOut { @keyframes antMoveRightOut {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateX(0%); transform: translateX(0%);
@ -92,7 +92,7 @@
} }
} }
@keyframes moveUpIn { @keyframes antMoveUpIn {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateY(-100%); transform: translateY(-100%);
@ -105,7 +105,7 @@
} }
} }
@keyframes moveUpOut { @keyframes antMoveUpOut {
0% { 0% {
transform-origin: 0 0; transform-origin: 0 0;
transform: translateY(0%); transform: translateY(0%);

@ -9,12 +9,12 @@
} }
} }
.slide-motion(slide-up, slideUp); .slide-motion(slide-up, antSlideUp);
.slide-motion(slide-down, slideDown); .slide-motion(slide-down, antSlideDown);
.slide-motion(slide-left, slideLeft); .slide-motion(slide-left, antSlideLeft);
.slide-motion(slide-right, slideRight); .slide-motion(slide-right, antSlideRight);
@keyframes slideUpIn { @keyframes antSlideUpIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 0% 0%; transform-origin: 0% 0%;
@ -27,7 +27,7 @@
} }
} }
@keyframes slideUpOut { @keyframes antSlideUpOut {
0% { 0% {
opacity: 1; opacity: 1;
transform-origin: 0% 0%; transform-origin: 0% 0%;
@ -40,7 +40,7 @@
} }
} }
@keyframes slideDownIn { @keyframes antSlideDownIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 100% 100%; transform-origin: 100% 100%;
@ -53,7 +53,7 @@
} }
} }
@keyframes slideDownOut { @keyframes antSlideDownOut {
0% { 0% {
opacity: 1; opacity: 1;
transform-origin: 100% 100%; transform-origin: 100% 100%;
@ -66,7 +66,7 @@
} }
} }
@keyframes slideLeftIn { @keyframes antSlideLeftIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 0% 0%; transform-origin: 0% 0%;
@ -79,7 +79,7 @@
} }
} }
@keyframes slideLeftOut { @keyframes antSlideLeftOut {
0% { 0% {
opacity: 1; opacity: 1;
transform-origin: 0% 0%; transform-origin: 0% 0%;
@ -92,7 +92,7 @@
} }
} }
@keyframes slideRightIn { @keyframes antSlideRightIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 100% 0%; transform-origin: 100% 0%;
@ -105,7 +105,7 @@
} }
} }
@keyframes slideRightOut { @keyframes antSlideRightOut {
0% { 0% {
opacity: 1; opacity: 1;
transform-origin: 100% 0%; transform-origin: 100% 0%;

@ -9,9 +9,9 @@
} }
} }
.swing-motion(swing, swing); .swing-motion(swing, antSwing);
@keyframes swingIn { @keyframes antSwingIn {
0%, 100% { 0%, 100% {
transform: translateX(0px); transform: translateX(0px);
} }

@ -9,14 +9,14 @@
} }
} }
.zoom-motion(zoom, zoom); .zoom-motion(zoom, antZoom);
.zoom-motion(zoom-big, zoomBig); .zoom-motion(zoom-big, antZoomBig);
.zoom-motion(zoom-up, zoomUp); .zoom-motion(zoom-up, antZoomUp);
.zoom-motion(zoom-down, zoomDown); .zoom-motion(zoom-down, antZoomDown);
.zoom-motion(zoom-left, zoomLeft); .zoom-motion(zoom-left, antZoomLeft);
.zoom-motion(zoom-right, zoomRight); .zoom-motion(zoom-right, antZoomRight);
@keyframes zoomIn { @keyframes antZoomIn {
0% { 0% {
opacity: 0; opacity: 0;
transform: scale(0); transform: scale(0);
@ -26,7 +26,7 @@
} }
} }
@keyframes zoomOut { @keyframes antZoomOut {
0% { 0% {
transform: scale(1); transform: scale(1);
} }
@ -35,7 +35,7 @@
transform: scale(0); transform: scale(0);
} }
} }
@keyframes zoomBigIn { @keyframes antZoomBigIn {
0% { 0% {
opacity: 0; opacity: 0;
transform: scale(.8); transform: scale(.8);
@ -45,7 +45,7 @@
} }
} }
@keyframes zoomBigOut { @keyframes antZoomBigOut {
0% { 0% {
transform: scale(1); transform: scale(1);
} }
@ -55,7 +55,7 @@
} }
} }
@keyframes zoomUpIn { @keyframes antZoomUpIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 50% 0%; transform-origin: 50% 0%;
@ -67,7 +67,7 @@
} }
} }
@keyframes zoomUpOut { @keyframes antZoomUpOut {
0% { 0% {
transform-origin: 50% 0%; transform-origin: 50% 0%;
transform: scale(1); transform: scale(1);
@ -79,7 +79,7 @@
} }
} }
@keyframes zoomLeftIn { @keyframes antZoomLeftIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 0% 50%; transform-origin: 0% 50%;
@ -91,7 +91,7 @@
} }
} }
@keyframes zoomLeftOut { @keyframes antZoomLeftOut {
0% { 0% {
transform-origin: 0% 50%; transform-origin: 0% 50%;
transform: scale(1); transform: scale(1);
@ -103,7 +103,7 @@
} }
} }
@keyframes zoomRightIn { @keyframes antZoomRightIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 100% 50%; transform-origin: 100% 50%;
@ -115,7 +115,7 @@
} }
} }
@keyframes zoomRightOut { @keyframes antZoomRightOut {
0% { 0% {
transform-origin: 100% 50%; transform-origin: 100% 50%;
transform: scale(1); transform: scale(1);
@ -127,7 +127,7 @@
} }
} }
@keyframes zoomDownIn { @keyframes antZoomDownIn {
0% { 0% {
opacity: 0; opacity: 0;
transform-origin: 50% 100%; transform-origin: 50% 100%;
@ -139,7 +139,7 @@
} }
} }
@keyframes zoomDownOut { @keyframes antZoomDownOut {
0% { 0% {
transform-origin: 50% 100%; transform-origin: 50% 100%;
transform: scale(1); transform: scale(1);

Loading…
Cancel
Save