@arco-design/mobile-react 2.22.3 → 2.24.0

package/dist/style.css

@@ -1,12 +1,12 @@
 * {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  -webkit-font-smoothing: antialiased;
   -webkit-tap-highlight-color: transparent;
 }
 body {
+  margin: 0;
+  padding: 0;
+  border: 0;
   touch-action: manipulation;
+  -webkit-font-smoothing: antialiased;
   -webkit-text-size-adjust: none;
 }
 button,
@@ -590,14 +590,6 @@ samp {
 .arco-loading .stroke-color-with-config {
   stroke: #165dff;
 }
-@-webkit-keyframes changDeg {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
 @keyframes changDeg {
   0% {
     transform: rotate(0deg);
@@ -609,8 +601,7 @@ samp {
 .arco-loading.circle,
 .arco-loading.arc,
 .arco-loading.spin {
-  -webkit-animation: changDeg 1s infinite linear;
-          animation: changDeg 1s infinite linear;
+  animation: changDeg 1s infinite linear;
 }
 .arco-loading.circle .loading-circle-middle {
   stop-opacity: 0.5;
@@ -669,16 +660,6 @@ samp {
   stop-opacity: 0;
 }
 
-@-webkit-keyframes scale-on {
-  0% {
-    transform: scale(0);
-    opacity: 0;
-  }
-  100% {
-    transform: scale(1);
-    opacity: 1;
-  }
-}
 @keyframes scale-on {
   0% {
     transform: scale(0);
@@ -689,16 +670,6 @@ samp {
     opacity: 1;
   }
 }
-@-webkit-keyframes scale-off {
-  0% {
-    transform: scale(1);
-    opacity: 1;
-  }
-  100% {
-    transform: scale(0);
-    opacity: 0;
-  }
-}
 @keyframes scale-off {
   0% {
     transform: scale(1);
@@ -710,12 +681,10 @@ samp {
   }
 }
 .arco-scale-enter-active {
-  -webkit-animation: scale-on 0.4s cubic-bezier(0.3, 1.3, 0.3, 1) forwards;
-          animation: scale-on 0.4s cubic-bezier(0.3, 1.3, 0.3, 1) forwards;
+  animation: scale-on 0.4s cubic-bezier(0.3, 1.3, 0.3, 1) forwards;
 }
 .arco-scale-exit-active {
-  -webkit-animation: scale-off 0.4s cubic-bezier(0.3, 1.3, 0.3, 1) forwards;
-          animation: scale-off 0.4s cubic-bezier(0.3, 1.3, 0.3, 1) forwards;
+  animation: scale-off 0.4s cubic-bezier(0.3, 1.3, 0.3, 1) forwards;
 }
 .arco-badge {
   cursor: pointer;
@@ -1584,14 +1553,6 @@ samp {
   display: inline-block;
   transition:  all 0.2s ;
 }
-@-webkit-keyframes changDeg {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
 @keyframes changDeg {
   0% {
     transform: rotate(0deg);
@@ -2085,17 +2046,6 @@ samp {
   align-items: center;
   justify-content: center;
 }
-@-webkit-keyframes caterpillarX {
-  0% {
-    transform: scaleX(1) translateZ(0);
-  }
-  50% {
-    transform: scaleX(2) translateZ(0);
-  }
-  100% {
-    transform: scaleX(1) translateZ(0);
-  }
-}
 @keyframes caterpillarX {
   0% {
     transform: scaleX(1) translateZ(0);
@@ -2107,17 +2057,6 @@ samp {
     transform: scaleX(1) translateZ(0);
   }
 }
-@-webkit-keyframes caterpillarY {
-  0% {
-    transform: scaleY(1) translateZ(0);
-  }
-  50% {
-    transform: scaleY(2) translateZ(0);
-  }
-  100% {
-    transform: scaleY(1) translateZ(0);
-  }
-}
 @keyframes caterpillarY {
   0% {
     transform: scaleY(1) translateZ(0);
@@ -2168,16 +2107,13 @@ samp {
   background-color:  #165dff ;
 }
 .arco-tab-cell-underline-inner.caterpillar {
-  -webkit-animation-timing-function: linear;
-          animation-timing-function: linear;
+  animation-timing-function: linear;
 }
 .arco-tab-cell-underline-inner.caterpillar:not(.custom-animate).vertical {
-  -webkit-animation-name: caterpillarX;
-          animation-name: caterpillarX;
+  animation-name: caterpillarX;
 }
 .arco-tab-cell-underline-inner.caterpillar:not(.custom-animate).horizontal {
-  -webkit-animation-name: caterpillarY;
-          animation-name: caterpillarY;
+  animation-name: caterpillarY;
 }
 .arco-tab-cell {
   font-size:  0.3rem ;
@@ -2333,16 +2269,6 @@ samp {
 }
 
 
-@-webkit-keyframes fade-scale-on {
-  0% {
-    opacity: 0;
-    transform: scale(0.5);
-  }
-  100% {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
 @keyframes fade-scale-on {
   0% {
     opacity: 0;
@@ -2353,16 +2279,6 @@ samp {
     transform: scale(1);
   }
 }
-@-webkit-keyframes fade-scale-off {
-  0% {
-    opacity: 1;
-    transform: scale(1);
-  }
-  100% {
-    opacity: 0;
-    transform: scale(0.5);
-  }
-}
 @keyframes fade-scale-off {
   0% {
     opacity: 1;
@@ -2374,12 +2290,10 @@ samp {
   }
 }
 .arco-fade-scale-enter-active {
-  -webkit-animation: fade-scale-on 0.45s cubic-bezier(0.2, 1.23, 0.25, 1) forwards;
-          animation: fade-scale-on 0.45s cubic-bezier(0.2, 1.23, 0.25, 1) forwards;
+  animation: fade-scale-on 0.45s cubic-bezier(0.2, 1.23, 0.25, 1) forwards;
 }
 .arco-fade-scale-exit-active {
-  -webkit-animation: fade-scale-off 0.15s cubic-bezier(0.48, 0.04, 0.52, 0.96) forwards;
-          animation: fade-scale-off 0.15s cubic-bezier(0.48, 0.04, 0.52, 0.96) forwards;
+  animation: fade-scale-off 0.15s cubic-bezier(0.48, 0.04, 0.52, 0.96) forwards;
 }
 .arco-dialog-mask,
 .arco-dialog-container {
@@ -3457,6 +3371,7 @@ samp {
 }
 .arco-input-clear {
   color:  #c9cdd4 ;
+  font-size:  16PX ;
 }
 .arco-input {
   display: inline-block;
@@ -3676,8 +3591,7 @@ samp {
   line-height:  0.72rem ;
 }
 .arco-notice-bar-content-inner.animate {
-  -webkit-animation: marquee linear both;
-          animation: marquee linear both;
+  animation: marquee linear both;
 }
 .arco-notice-bar-content .arco-carousel {
   height:  0.72rem ;
@@ -3710,14 +3624,6 @@ samp {
   right: -2PX;
   transform: rotate(180deg);
 }
-@-webkit-keyframes marquee {
-  0% {
-    transform: translate3d(0, 0, 0);
-  }
-  100% {
-    transform: translate3d(-100%, 0, 0);
-  }
-}
 @keyframes marquee {
   0% {
     transform: translate3d(0, 0, 0);
@@ -3992,7 +3898,6 @@ samp {
 .arco-popover-inner {
   box-sizing: border-box;
   position: absolute;
-  width: -webkit-max-content;
   width: -moz-max-content;
   width: max-content;
   z-index: 1010;
@@ -4335,7 +4240,6 @@ samp {
   position: absolute;
   display: flex;
   width: 100%;
-  height: -webkit-fit-content;
   height: -moz-fit-content;
   height: fit-content;
   justify-content: center;
@@ -4561,10 +4465,8 @@ samp {
 .arco-slider-thumb-wrapper {
   position: absolute;
   display: flex;
-  width: -webkit-fit-content;
   width: -moz-fit-content;
   width: fit-content;
-  height: -webkit-fit-content;
   height: -moz-fit-content;
   height: fit-content;
   margin: auto;
@@ -4599,7 +4501,6 @@ samp {
 }
 .arco-slider-popover {
   position: absolute;
-  width: -webkit-max-content;
   width: -moz-max-content;
   width: max-content;
   color:  #fff ;
@@ -4847,6 +4748,69 @@ samp {
   color:  #165dff ;
 }
 
+.arco-stepper {
+  display: flex;
+  font-size:  0.28rem ;
+}
+.arco-stepper.arco-square {
+  border:  1PX solid #f2f3f5 ;
+  border-radius:  0.04rem ;
+}
+.arco-stepper.arco-square .arco-stepper-add-button,
+.arco-stepper.arco-square .arco-stepper-minus-button,
+.arco-stepper.arco-square .arco-stepper-input {
+  background:  #ffffff ;
+}
+.arco-stepper.arco-square .arco-stepper-input {
+  border-left:  1PX solid #f2f3f5 ;
+  border-right:  1PX solid #f2f3f5 ;
+}
+.arco-stepper.arco-round .arco-stepper-minus-button,
+.arco-stepper.arco-round .arco-stepper-add-button {
+  border-radius:  50% ;
+}
+.arco-stepper.arco-round .arco-stepper-input {
+  background:  transparent ;
+}
+.arco-stepper-minus-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size:  0.2rem ;
+  width:  0.56rem ;
+  height:  0.56rem ;
+  background:  #f7f8fa ;
+}
+.arco-stepper-minus-button-icon {
+  color:  #1d2129 ;
+}
+.arco-stepper-minus-button-icon.disabled {
+  color:  #c9cdd4 ;
+}
+.arco-stepper-input {
+  text-align: center;
+  width:  0.8rem ;
+  height:  0.56rem ;
+  background:  #f7f8fa ;
+  color:  #1d2129 ;
+  margin:  0 1PX ;
+}
+.arco-stepper-add-button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size:  0.2rem ;
+  width:  0.56rem ;
+  height:  0.56rem ;
+  background:  #f7f8fa ;
+}
+.arco-stepper-add-button-icon {
+  color:  #1d2129 ;
+}
+.arco-stepper-add-button-icon.disabled {
+  color:  #c9cdd4 ;
+}
+
 .arco-steps {
   display: flex;
   padding:  0.32rem 0 ;