blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

style: fix animation css vars not work (#9337)

Browse Source
This commit is contained in:
neverland 2021-08-26 10:21:26 +08:00 committed by GitHub
parent 3e74e451bb
commit 229695cadc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 24 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/progress/index.less
View File

@ -25,7 +25,8 @@
background: var(--van-progress-color);
border-radius: inherit;
transform-origin: 0;
transition: all 0.3s ease-out;
transition: all var(--van-animation-duration-base)
var(--van-animation-timing-function-enter);
}
&__pivot {
@ -41,6 +42,7 @@
word-break: keep-all;
background-color: var(--van-progress-pivot-background-color);
border-radius: 1em;
transition: all 0.3s ease-out;
transition: all var(--van-animation-duration-base)
var(--van-animation-timing-function-enter);
}
}

40
src/style/animation.less
View File

@ -80,60 +80,60 @@
.van-fade {
&-enter-active {
animation: @animation-duration-base van-fade-in both
@animation-timing-function-enter;
animation: var(--van-animation-duration-base) van-fade-in both
var(--van-animation-timing-function-enter);
}
&-leave-active {
animation: @animation-duration-base van-fade-out both
@animation-timing-function-leave;
animation: var(--van-animation-duration-base) van-fade-out both
var(--van-animation-timing-function-leave);
}
}
.van-slide-up {
&-enter-active {
animation: van-slide-up-enter @animation-duration-base both
@animation-timing-function-enter;
animation: van-slide-up-enter var(--van-animation-duration-base) both
var(--van-animation-timing-function-enter);
}
&-leave-active {
animation: van-slide-up-leave @animation-duration-base both
@animation-timing-function-leave;
animation: van-slide-up-leave var(--van-animation-duration-base) both
var(--van-animation-timing-function-leave);
}
}
.van-slide-down {
&-enter-active {
animation: van-slide-down-enter @animation-duration-base both
@animation-timing-function-enter;
animation: van-slide-down-enter var(--van-animation-duration-base) both
var(--van-animation-timing-function-enter);
}
&-leave-active {
animation: van-slide-down-leave @animation-duration-base both
@animation-timing-function-leave;
animation: van-slide-down-leave var(--van-animation-duration-base) both
var(--van-animation-timing-function-leave);
}
}
.van-slide-left {
&-enter-active {
animation: van-slide-left-enter @animation-duration-base both
@animation-timing-function-enter;
animation: van-slide-left-enter var(--van-animation-duration-base) both
var(--van-animation-timing-function-enter);
}
&-leave-active {
animation: van-slide-left-leave @animation-duration-base both
@animation-timing-function-leave;
animation: van-slide-left-leave var(--van-animation-duration-base) both
var(--van-animation-timing-function-leave);
}
}
.van-slide-right {
&-enter-active {
animation: van-slide-right-enter @animation-duration-base both
@animation-timing-function-enter;
animation: van-slide-right-enter var(--van-animation-duration-base) both
var(--van-animation-timing-function-enter);
}
&-leave-active {
animation: van-slide-right-leave @animation-duration-base both
@animation-timing-function-leave;
animation: van-slide-right-leave var(--van-animation-duration-base) both
var(--van-animation-timing-function-leave);
}
}