You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

161 lines
2.6 KiB

.zoom-motion(@className, @keyframeName, @duration: @animation-duration-base) {
.make-motion(@className, @keyframeName, @duration);
.@{className}-enter,
.@{className}-appear {
transform: scale(0); // need this by yiminghe
animation-timing-function: @ease-out-circ;
10 years ago
}
.@{className}-leave {
animation-timing-function: @ease-in-out-circ;
10 years ago
}
}
// For Modal, Select choosen item
.zoom-motion(zoom, antZoom);
// For Popover, Popconfirm, Dropdown
.zoom-motion(zoom-big, antZoomBig);
// For Tooltip
.zoom-motion(zoom-big-fast, antZoomBig, @animation-duration-fast);
.zoom-motion(zoom-up, antZoomUp);
.zoom-motion(zoom-down, antZoomDown);
.zoom-motion(zoom-left, antZoomLeft);
.zoom-motion(zoom-right, antZoomRight);
10 years ago
@keyframes antZoomIn {
10 years ago
0% {
opacity: 0;
transform: scale(0.2);
10 years ago
}
100% {
opacity: 1;
transform: scale(1);
10 years ago
}
}
@keyframes antZoomOut {
10 years ago
0% {
transform: scale(1);
10 years ago
}
100% {
opacity: 0;
transform: scale(0.2);
10 years ago
}
}
9 years ago
@keyframes antZoomBigIn {
0% {
opacity: 0;
transform: scale(.8);
}
100% {
transform: scale(1);
}
}
@keyframes antZoomBigOut {
0% {
transform: scale(1);
}
100% {
opacity: 0;
transform: scale(.8);
}
}
10 years ago
@keyframes antZoomUpIn {
10 years ago
0% {
opacity: 0;
transform-origin: 50% 0%;
transform: scale(.8);
10 years ago
}
100% {
transform-origin: 50% 0%;
transform: scale(1);
10 years ago
}
}
@keyframes antZoomUpOut {
10 years ago
0% {
transform-origin: 50% 0%;
transform: scale(1);
10 years ago
}
100% {
opacity: 0;
transform-origin: 50% 0%;
transform: scale(.8);
10 years ago
}
}
@keyframes antZoomLeftIn {
10 years ago
0% {
opacity: 0;
transform-origin: 0% 50%;
transform: scale(.8);
10 years ago
}
100% {
transform-origin: 0% 50%;
transform: scale(1);
10 years ago
}
}
@keyframes antZoomLeftOut {
10 years ago
0% {
transform-origin: 0% 50%;
transform: scale(1);
10 years ago
}
100% {
opacity: 0;
transform-origin: 0% 50%;
transform: scale(.8);
10 years ago
}
}
@keyframes antZoomRightIn {
10 years ago
0% {
opacity: 0;
transform-origin: 100% 50%;
transform: scale(.8);
10 years ago
}
100% {
transform-origin: 100% 50%;
transform: scale(1);
10 years ago
}
}
@keyframes antZoomRightOut {
10 years ago
0% {
transform-origin: 100% 50%;
transform: scale(1);
10 years ago
}
100% {
opacity: 0;
transform-origin: 100% 50%;
transform: scale(.8);
10 years ago
}
}
@keyframes antZoomDownIn {
10 years ago
0% {
opacity: 0;
transform-origin: 50% 100%;
transform: scale(.8);
10 years ago
}
100% {
transform-origin: 50% 100%;
transform: scale(1);
10 years ago
}
}
@keyframes antZoomDownOut {
10 years ago
0% {
transform-origin: 50% 100%;
transform: scale(1);
10 years ago
}
100% {
opacity: 0;
transform-origin: 50% 100%;
transform: scale(.8);
10 years ago
}
}