add Select Component
add Select Component
This commit is contained in:
parent
c13471b5fb
commit
e355dd49d3
21 changed files with 1137 additions and 99 deletions
119
styles/animation/slide.less
Normal file
119
styles/animation/slide.less
Normal file
|
@ -0,0 +1,119 @@
|
|||
.slide-motion(@className, @keyframeName) {
|
||||
.make-motion(@className, @keyframeName);
|
||||
.@{className}-enter, .@{className}-appear {
|
||||
opacity: 0;
|
||||
animation-timing-function: @ease-in-out;
|
||||
}
|
||||
.@{className}-leave {
|
||||
animation-timing-function: @ease-in-out;
|
||||
}
|
||||
}
|
||||
|
||||
.slide-motion(slide-up, ivuSlideUp);
|
||||
.slide-motion(slide-down, ivuSlideDown);
|
||||
.slide-motion(slide-left, ivuSlideLeft);
|
||||
.slide-motion(slide-right, ivuSlideRight);
|
||||
|
||||
@keyframes ivuSlideUpIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleY(.8);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideUpOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleY(.8);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideDownIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform-origin: 100% 100%;
|
||||
transform: scaleY(.8);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform-origin: 100% 100%;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideDownOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform-origin: 100% 100%;
|
||||
transform: scaleY(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform-origin: 100% 100%;
|
||||
transform: scaleY(.8);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideLeftIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleX(.8);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleX(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideLeftOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleX(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform-origin: 0% 0%;
|
||||
transform: scaleX(.8);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideRightIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform-origin: 100% 0%;
|
||||
transform: scaleX(.8);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform-origin: 100% 0%;
|
||||
transform: scaleX(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes ivuSlideRightOut {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform-origin: 100% 0%;
|
||||
transform: scaleX(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform-origin: 100% 0%;
|
||||
transform: scaleX(.8);
|
||||
}
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue