From b4608cebdfdc9a3de701c3e38eb5b5c2cb54745e Mon Sep 17 00:00:00 2001 From: ascodelife <394922886@qq.com> Date: Wed, 25 Aug 2021 12:53:43 +0800 Subject: [PATCH] chore(Progress): change style --- src/progress/Progress.tsx | 6 ------ src/progress/index.less | 5 ++++- 2 files changed, 4 insertions(+), 7 deletions(-) diff --git a/src/progress/Progress.tsx b/src/progress/Progress.tsx index 069799815..4e4030143 100644 --- a/src/progress/Progress.tsx +++ b/src/progress/Progress.tsx @@ -3,8 +3,6 @@ import { truthProp, createNamespace, addUnit } from '../utils'; const [name, bem] = createNamespace('progress'); -const transition = 'all 0.3s cubic-bezier(0.46, 0.03, 0.52, 0.96)'; - const props = { color: String, inactive: Boolean, @@ -45,7 +43,6 @@ export default defineComponent({ left: `${+percentage!}%`, transform: `translate(-${+percentage!}%,-50%)`, background: pivotColor || background.value, - transition, }; return ( @@ -64,10 +61,7 @@ export default defineComponent({ }; const portionStyle = { background: background.value, - width: '100%', transform: `scaleX(${scaleX.value})`, - 'transform-origin': 0, - transition, }; return ( diff --git a/src/progress/index.less b/src/progress/index.less index cddacf0ba..75f24cad3 100644 --- a/src/progress/index.less +++ b/src/progress/index.less @@ -20,9 +20,12 @@ &__portion { position: absolute; left: 0; + width: 100%; height: 100%; background: var(--van-progress-color); border-radius: inherit; + transform-origin: 0; + transition: all 0.3s ease-out; } &__pivot { @@ -38,6 +41,6 @@ word-break: keep-all; background-color: var(--van-progress-pivot-background-color); border-radius: 1em; - transform: translate(0, -50%); + transition: all 0.3s ease-out; } }