feat: improve leave animation timing function (#5954)

This commit is contained in:
neverland
2020-03-30 20:43:40 +08:00
committed by GitHub
parent d0132f23f3
commit b6d23cd9d3
4 changed files with 37 additions and 12 deletions
+20 -10
View File
@@ -80,50 +80,60 @@
.van-fade {
&-enter-active {
animation: @animation-duration-base van-fade-in;
animation: @animation-duration-base van-fade-in both
@animation-timing-function-enter;
}
&-leave-active {
animation: @animation-duration-base van-fade-out;
animation: @animation-duration-base van-fade-out both
@animation-timing-function-leave;
}
}
.van-slide-up {
&-enter-active {
animation: van-slide-up-enter @animation-duration-base both ease;
animation: van-slide-up-enter @animation-duration-base both
@animation-timing-function-enter;
}
&-leave-active {
animation: van-slide-up-leave @animation-duration-base both ease;
animation: van-slide-up-leave @animation-duration-base both
@animation-timing-function-leave;
}
}
.van-slide-down {
&-enter-active {
animation: van-slide-down-enter @animation-duration-base both ease;
animation: van-slide-down-enter @animation-duration-base both
@animation-timing-function-enter;
}
&-leave-active {
animation: van-slide-down-leave @animation-duration-base both ease;
animation: van-slide-down-leave @animation-duration-base both
@animation-timing-function-leave;
}
}
.van-slide-left {
&-enter-active {
animation: van-slide-left-enter @animation-duration-base both ease;
animation: van-slide-left-enter @animation-duration-base both
@animation-timing-function-enter;
}
&-leave-active {
animation: van-slide-left-leave @animation-duration-base both ease;
animation: van-slide-left-leave @animation-duration-base both
@animation-timing-function-leave;
}
}
.van-slide-right {
&-enter-active {
animation: van-slide-right-enter @animation-duration-base both ease;
animation: van-slide-right-enter @animation-duration-base both
@animation-timing-function-enter;
}
&-leave-active {
animation: van-slide-right-leave @animation-duration-base both ease;
animation: van-slide-right-leave @animation-duration-base both
@animation-timing-function-leave;
}
}