vant/packages/style/animation.less
2018-11-25 09:28:21 +08:00

84 lines
1.1 KiB
Plaintext

@keyframes van-slide-up-enter {
from {
transform: translate3d(0, 100%, 0);
}
}
@keyframes van-slide-up-leave {
to {
transform: translate3d(0, 100%, 0);
}
}
@keyframes van-slide-down-enter {
from {
transform: translate3d(0, -100%, 0);
}
}
@keyframes van-slide-down-leave {
to {
transform: translate3d(0, -100%, 0);
}
}
@keyframes van-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes van-fade-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes van-rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.van-fade {
&-enter-active {
animation: .3s van-fade-in;
}
&-leave-active {
animation: .3s van-fade-out;
}
}
.van-slide-up {
&-enter-active {
animation: van-slide-up-enter .3s both ease;
}
&-leave-active {
animation: van-slide-up-leave .3s both ease;
}
}
.van-slide-down {
&-enter-active {
animation: van-slide-down-enter .3s both ease;
}
&-leave-active {
animation: van-slide-down-leave .3s both ease;
}
}