feat: taro-inputnumber

src/packages/__VUE/icon/index.scss

@@ -1,3 +1,4 @@
+// @import '../../styles/font/iconfont.css';
 .nut-icon {
   display: inline-block;
   position: relative;

src/packages/__VUE/inputnumber/index.scss

@@ -9,6 +9,8 @@
   }
 
   &__icon {
+    display: flex;
+    align-items: center;
     color: $inputnumber-icon-color;
     font-size: $inputnumber-icon-size;
     cursor: pointer;
@@ -18,6 +20,15 @@
     }
   }
 
+  &__text--readonly {
+    width: $inputnumber-input-width;
+    height: 100%;
+    text-align: center;
+    margin: 0 6px;
+    background-color: $inputnumber-input-background-color;
+    border-radius: $inputnumber-input-border-radius;
+  }
+
   input {
     width: $inputnumber-input-width;
     height: 100%;

src/sites/mobile-taro/vue/dist/app.js

@@ -1421,7 +1421,7 @@ require('./taro');
 
           function NumberOf(val) {
             var res = Object(
-              _vue_runtime_core__WEBPACK_IMPORTED_MODULE_3__[/* toNumber */ 'K']
+              _vue_runtime_core__WEBPACK_IMPORTED_MODULE_3__[/* toNumber */ 'L']
             )(val);
             if (true) validateDuration(res);
             return res;
@@ -1882,7 +1882,7 @@ require('./taro');
                 } else if (castToNumber) {
                   domValue = Object(
                     _vue_runtime_core__WEBPACK_IMPORTED_MODULE_3__[
-                      /* toNumber */ 'K'
+                      /* toNumber */ 'L'
                     ]
                   )(domValue);
                 }
@@ -1929,7 +1929,7 @@ require('./taro');
                   (number || el.type === 'number') &&
                   Object(
                     _vue_runtime_core__WEBPACK_IMPORTED_MODULE_3__[
-                      /* toNumber */ 'K'
+                      /* toNumber */ 'L'
                     ]
                   )(el.value) === value
                 ) {
@@ -2084,7 +2084,7 @@ require('./taro');
                     return number
                       ? Object(
                           _vue_runtime_core__WEBPACK_IMPORTED_MODULE_3__[
-                            /* toNumber */ 'K'
+                            /* toNumber */ 'L'
                           ]
                         )(getValue(o))
                       : getValue(o);
@@ -2705,7 +2705,7 @@ require('./taro');
               slots = _ref.slots;
 
             var _toRefs = Object(
-                vue__WEBPACK_IMPORTED_MODULE_1__[/* toRefs */ 'q']
+                vue__WEBPACK_IMPORTED_MODULE_1__[/* toRefs */ 'r']
               )(props),
               type = _toRefs.type,
               size = _toRefs.size,
@@ -2849,11 +2849,11 @@ require('./taro');
         };
         function render(_ctx, _cache, $props, $setup, $data, $options) {
           var _component_nut_icon = Object(
-            vue__WEBPACK_IMPORTED_MODULE_0__[/* resolveComponent */ 'h']
+            vue__WEBPACK_IMPORTED_MODULE_0__[/* resolveComponent */ 'p']
           )('nut-icon');
 
           return (
-            Object(vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'f'])(),
+            Object(vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'm'])(),
             Object(vue__WEBPACK_IMPORTED_MODULE_0__[/* createBlock */ 'b'])(
               'view',
               {
@@ -2875,7 +2875,7 @@ require('./taro');
                   [
                     _ctx.loading
                       ? (Object(
-                          vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'f']
+                          vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'm']
                         )(),
                         Object(
                           vue__WEBPACK_IMPORTED_MODULE_0__[
@@ -2892,7 +2892,7 @@ require('./taro');
                         )('v-if', true),
                     _ctx.icon && !_ctx.loading
                       ? (Object(
-                          vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'f']
+                          vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'm']
                         )(),
                         Object(
                           vue__WEBPACK_IMPORTED_MODULE_0__[
@@ -2917,7 +2917,7 @@ require('./taro');
                         )('v-if', true),
                     _ctx.$slots.default
                       ? (Object(
-                          vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'f']
+                          vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'm']
                         )(),
                         Object(
                           vue__WEBPACK_IMPORTED_MODULE_0__[
@@ -2934,7 +2934,7 @@ require('./taro');
                           [
                             Object(
                               vue__WEBPACK_IMPORTED_MODULE_0__[
-                                /* renderSlot */ 'g'
+                                /* renderSlot */ 'o'
                               ]
                             )(_ctx.$slots, 'default')
                           ],
@@ -3048,7 +3048,7 @@ require('./taro');
         );
 
         var config = {
-          pages: ['pages/icon-demo/index', 'pages/button-demo/index'],
+          pages: ['pages/inputnumber/demo', 'pages/button/demo'],
           window: {
             backgroundTextStyle: 'light',
             navigationBarBackgroundColor: '#fff',

src/sites/mobile-taro/vue/dist/app.wxss

@@ -329,6 +329,49 @@ view-block {
   -webkit-animation-name: nutRotateOut;
           animation-name: nutRotateOut;
 }
+
+.demo {
+  height: 100%;
+  background: #f7f8fa;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 114rpx 34rpx 0 34rpx;
+}
+
+.demo.full {
+  padding: 114rpx 0 0 0;
+}
+
+.demo.full .h5-h2 {
+  padding-left: 34rpx;
+}
+
+.demo.bg-w {
+  background: #fff;
+}
+
+.demo::-webkit-scrollbar {
+  width: 0;
+  background: transparent;
+}
+
+.demo > .h5-h2 {
+  margin-top: 60rpx;
+  margin-bottom: 20rpx;
+  font-size: 28rpx;
+  color: #909ca4;
+  padding: 0 20rpx;
+  font-weight: normal;
+}
+
+.demo > .h5-p {
+  font-size: 24rpx;
+}
+
+.demo .card {
+  padding: 50rpx 36rpx;
+  background: white;
+}
 view-block {
   display: block;
 }
@@ -933,5 +976,3 @@ to {
 .nut-button--square {
   border-radius: 0;
 }
-
-@import "./common.wxss";

src/sites/mobile-taro/vue/dist/common.wxss

@@ -1,656 +0,0 @@
-view-block {
-  display: block;
-}
-@-webkit-keyframes nutFadeIn {
-from {
-    opacity: 0;
-}
-to {
-    opacity: 1;
-}
-}
-@keyframes nutFadeIn {
-from {
-    opacity: 0;
-}
-to {
-    opacity: 1;
-}
-}
-@-webkit-keyframes nutFadeOut {
-from {
-    opacity: 1;
-}
-to {
-    opacity: 0;
-}
-}
-@keyframes nutFadeOut {
-from {
-    opacity: 1;
-}
-to {
-    opacity: 0;
-}
-}
-.nutFade-enter-active,
-.nutFadeIn,
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutFade-enter-active,
-.nutFadeIn {
-  -webkit-animation-name: nutFadeIn;
-          animation-name: nutFadeIn;
-}
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-name: nutFadeOut;
-          animation-name: nutFadeOut;
-}
-@-webkit-keyframes nutZoomIn {
-from {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-50% {
-    opacity: 1;
-}
-}
-@keyframes nutZoomIn {
-from {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-50% {
-    opacity: 1;
-}
-}
-@-webkit-keyframes nutZoomOut {
-from {
-    opacity: 1;
-}
-50% {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-to {
-    opacity: 0;
-}
-}
-@keyframes nutZoomOut {
-from {
-    opacity: 1;
-}
-50% {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-to {
-    opacity: 0;
-}
-}
-.nutZoom-enter-active,
-.nutZoomIn,
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutZoom-enter-active,
-.nutZoomIn {
-  -webkit-animation-name: nutZoomIn;
-          animation-name: nutZoomIn;
-}
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-name: nutZoomOut;
-          animation-name: nutZoomOut;
-}
-@-webkit-keyframes nutEaseIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-}
-@keyframes nutEaseIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-}
-@-webkit-keyframes nutEaseOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-}
-@keyframes nutEaseOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-}
-.nutEase-enter-active,
-.nutEaseIn,
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutEase-enter-active,
-.nutEaseIn {
-  -webkit-animation-name: nutEaseIn;
-          animation-name: nutEaseIn;
-}
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-name: nutEaseOut;
-          animation-name: nutEaseOut;
-}
-@-webkit-keyframes nutDropIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-}
-@keyframes nutDropIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-}
-@-webkit-keyframes nutDropOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-}
-@keyframes nutDropOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-}
-.nutDrop-enter-active,
-.nutDropIn,
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutDrop-enter-active,
-.nutDropIn {
-  -webkit-animation-name: nutDropIn;
-          animation-name: nutDropIn;
-}
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-name: nutDropOut;
-          animation-name: nutDropOut;
-}
-@-webkit-keyframes rotation {
-0% {
-    -webkit-transform: rotate(0deg);
-}
-100% {
-    -webkit-transform: rotate(360deg);
-}
-}
-@keyframes rotation {
-0% {
-    -webkit-transform: rotate(0deg);
-}
-100% {
-    -webkit-transform: rotate(360deg);
-}
-}
-.nutRotate-enter-active,
-.nutRotateIn,
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutRotate-enter-active,
-.nutRotateIn {
-  -webkit-animation-name: nutRotateIn;
-          animation-name: nutRotateIn;
-}
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-name: nutRotateOut;
-          animation-name: nutRotateOut;
-}
-view-block {
-  display: block;
-}
-@keyframes nutFadeIn {
-from {
-    opacity: 0;
-}
-to {
-    opacity: 1;
-}
-}
-@keyframes nutFadeOut {
-from {
-    opacity: 1;
-}
-to {
-    opacity: 0;
-}
-}
-.nutFade-enter-active,
-.nutFadeIn,
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutFade-enter-active,
-.nutFadeIn {
-  -webkit-animation-name: nutFadeIn;
-          animation-name: nutFadeIn;
-}
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-name: nutFadeOut;
-          animation-name: nutFadeOut;
-}
-@keyframes nutZoomIn {
-from {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-50% {
-    opacity: 1;
-}
-}
-@keyframes nutZoomOut {
-from {
-    opacity: 1;
-}
-50% {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-to {
-    opacity: 0;
-}
-}
-.nutZoom-enter-active,
-.nutZoomIn,
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutZoom-enter-active,
-.nutZoomIn {
-  -webkit-animation-name: nutZoomIn;
-          animation-name: nutZoomIn;
-}
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-name: nutZoomOut;
-          animation-name: nutZoomOut;
-}
-@keyframes nutEaseIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-}
-@keyframes nutEaseOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-}
-.nutEase-enter-active,
-.nutEaseIn,
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutEase-enter-active,
-.nutEaseIn {
-  -webkit-animation-name: nutEaseIn;
-          animation-name: nutEaseIn;
-}
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-name: nutEaseOut;
-          animation-name: nutEaseOut;
-}
-@keyframes nutDropIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-}
-@keyframes nutDropOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-}
-.nutDrop-enter-active,
-.nutDropIn,
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutDrop-enter-active,
-.nutDropIn {
-  -webkit-animation-name: nutDropIn;
-          animation-name: nutDropIn;
-}
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-name: nutDropOut;
-          animation-name: nutDropOut;
-}
-@keyframes rotation {
-0% {
-    -webkit-transform: rotate(0deg);
-}
-100% {
-    -webkit-transform: rotate(360deg);
-}
-}
-.nutRotate-enter-active,
-.nutRotateIn,
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutRotate-enter-active,
-.nutRotateIn {
-  -webkit-animation-name: nutRotateIn;
-          animation-name: nutRotateIn;
-}
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-name: nutRotateOut;
-          animation-name: nutRotateOut;
-}
-.nut-button {
-  position: relative;
-  display: inline-block;
-  -webkit-flex-shrink: 0;
-      -ms-flex-negative: 0;
-          flex-shrink: 0;
-  height: 76rpx;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  line-height: 72rpx;
-  font-size: 28rpx;
-  text-align: center;
-  -webkit-transition: opacity 0.2s;
-  -o-transition: opacity 0.2s;
-  transition: opacity 0.2s;
-  -webkit-appearance: none;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
-  -ms-touch-action: manipulation;
-      touch-action: manipulation;
-}
-.nut-button .text {
-  margin-left: 10rpx;
-}
-.nut-button::before {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  width: 100%;
-  height: 100%;
-  background-color: #000;
-  border: inherit;
-  border-color: #000;
-  border-radius: inherit;
-  -webkit-transform: translate(-50%, -50%);
-      -ms-transform: translate(-50%, -50%);
-          transform: translate(-50%, -50%);
-  opacity: 0;
-  content: " ";
-}
-.nut-button:active::before {
-  opacity: 0.1;
-}
-.nut-button__warp {
-  height: 100%;
-  width: 100%;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-justify-content: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-}
-.nut-button--loading::before, .nut-button--disabled::before {
-  display: none;
-}
-.nut-button--default {
-  color: #666666;
-  background: #fff;
-  border: 2rpx solid #cccccc;
-}
-.nut-button--primary {
-  color: #fff;
-  background: -webkit-linear-gradient(315deg, #fa2c19 0%, #fa6419 100%);
-  background: -o-linear-gradient(315deg, #fa2c19 0%, #fa6419 100%);
-  background: linear-gradient(135deg, #fa2c19 0%, #fa6419 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--info {
-  color: #fff;
-  background: -webkit-linear-gradient(135deg, #498ff2 0%, #4965f2 100%);
-  background: -o-linear-gradient(135deg, #498ff2 0%, #4965f2 100%);
-  background: linear-gradient(315deg, #498ff2 0%, #4965f2 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--success {
-  color: #fff;
-  background: -webkit-linear-gradient(315deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
-  background: -o-linear-gradient(315deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
-  background: linear-gradient(135deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--danger {
-  color: #fff;
-  background: #fa2c19;
-  border: 2rpx solid transparent;
-}
-.nut-button--warning {
-  color: #fff;
-  background: -webkit-linear-gradient(315deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
-  background: -o-linear-gradient(315deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
-  background: linear-gradient(135deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--plain {
-  background: #fff;
-}
-.nut-button--plain.nut-button--primary {
-  color: #fa2c19;
-  border-color: #fa2c19;
-}
-.nut-button--plain.nut-button--info {
-  color: #496af2;
-  border-color: #496af2;
-}
-.nut-button--plain.nut-button--success {
-  color: #26bf26;
-  border-color: #26bf26;
-}
-.nut-button--plain.nut-button--danger {
-  color: #fa2c19;
-  border-color: #fa2c19;
-}
-.nut-button--plain.nut-button--warning {
-  color: #ff9e0d;
-  border-color: #ff9e0d;
-}
-.nut-button--large {
-  width: 100%;
-  height: 96rpx;
-  line-height: 92rpx;
-}
-.nut-button--normal {
-  padding: 0 36rpx;
-  font-size: 28rpx;
-}
-.nut-button--small {
-  height: 56rpx;
-  line-height: 52rpx;
-  padding: 0 24rpx;
-  font-size: 24rpx;
-}
-.nut-button--block {
-  display: block;
-  width: 100%;
-}
-.nut-button--disabled {
-  opacity: 0.68;
-}
-.nut-button--loading {
-  opacity: 0.9;
-}
-.nut-button--round {
-  border-radius: 50rpx;
-}
-.nut-button--square {
-  border-radius: 0;
-}

src/sites/mobile-taro/vue/dist/pages/button-demo/index.js

@@ -1,232 +0,0 @@
-(wx['webpackJsonp'] = wx['webpackJsonp'] || []).push([
-  ['pages/button-demo/index'],
-  {
-    /***/ './node_modules/@tarojs/taro-loader/lib/raw.js!./src/pages/button-demo/index.vue':
-      /*!***************************************************************************************!*\
-  !*** ./node_modules/@tarojs/taro-loader/lib/raw.js!./src/pages/button-demo/index.vue ***!
-  \***************************************************************************************/
-      /*! exports provided: default */
-      /*! exports used: default */
-      /***/ function(module, __webpack_exports__, __webpack_require__) {
-        'use strict';
-        /* harmony import */ var _index_vue_vue_type_template_id_2436f8cd__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
-          /*! ./index.vue?vue&type=template&id=2436f8cd */ './src/pages/button-demo/index.vue?vue&type=template&id=2436f8cd'
-        );
-        /* harmony import */ var _index_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(
-          /*! ./index.vue?vue&type=script&lang=js */ './src/pages/button-demo/index.vue?vue&type=script&lang=js'
-        );
-
-        _index_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__[
-          /* default */ 'a'
-        ].render =
-          _index_vue_vue_type_template_id_2436f8cd__WEBPACK_IMPORTED_MODULE_0__[
-            /* render */ 'a'
-          ];
-        /* hot reload */
-        if (false) {
-        }
-
-        _index_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__[
-          /* default */ 'a'
-        ].__file = 'src/pages/button-demo/index.vue';
-
-        /* harmony default export */ __webpack_exports__['a'] =
-          _index_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_1__[
-            /* default */ 'a'
-          ];
-
-        /***/
-      },
-
-    /***/ './node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/dist/index.js?!./src/pages/button-demo/index.vue?vue&type=script&lang=js':
-      /*!*******************************************************************************************************************************************!*\
-  !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/dist??ref--10-0!./src/pages/button-demo/index.vue?vue&type=script&lang=js ***!
-  \*******************************************************************************************************************************************/
-      /*! exports provided: default */
-      /*! exports used: default */
-      /***/ function(module, __webpack_exports__, __webpack_require__) {
-        'use strict';
-        /* harmony import */ var _button_index_taro_vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
-          /*! ../button/index.taro.vue */ './src/pages/button/index.taro.vue'
-        );
-
-        /* harmony default export */ __webpack_exports__['a'] = {
-          components: {
-            'nut-button':
-              _button_index_taro_vue__WEBPACK_IMPORTED_MODULE_0__[
-                /* default */ 'a'
-              ]
-          },
-          setup: function setup() {
-            var handleClick = function handleClick() {
-              console.log('click!!!');
-            };
-
-            return {
-              handleClick: handleClick
-            };
-          }
-        };
-
-        /***/
-      },
-
-    /***/ './node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/dist/templateLoader.js?!./node_modules/vue-loader/dist/index.js?!./src/pages/button-demo/index.vue?vue&type=template&id=2436f8cd':
-      /*!**********************************************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/babel-loader/lib!./node_modules/vue-loader/dist/templateLoader.js??ref--6!./node_modules/vue-loader/dist??ref--10-0!./src/pages/button-demo/index.vue?vue&type=template&id=2436f8cd ***!
-  \**********************************************************************************************************************************************************************************************************/
-      /*! exports provided: render */
-      /*! exports used: render */
-      /***/ function(module, __webpack_exports__, __webpack_require__) {
-        'use strict';
-        /* harmony export (binding) */ __webpack_require__.d(
-          __webpack_exports__,
-          'a',
-          function() {
-            return render;
-          }
-        );
-        /* harmony import */ var vue__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
-          /*! vue */ './node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js'
-        );
-
-        var _hoisted_1 = {
-          class: 'index'
-        };
-
-        var _hoisted_2 = /*#__PURE__*/ Object(
-          vue__WEBPACK_IMPORTED_MODULE_0__[/* createTextVNode */ 'i']
-        )('主要按钮');
-
-        function render(_ctx, _cache, $props, $setup, $data, $options) {
-          var _component_nut_button = Object(
-            vue__WEBPACK_IMPORTED_MODULE_0__[/* resolveComponent */ 's']
-          )('nut-button');
-
-          return (
-            Object(vue__WEBPACK_IMPORTED_MODULE_0__[/* openBlock */ 'q'])(),
-            Object(vue__WEBPACK_IMPORTED_MODULE_0__[/* createBlock */ 'e'])(
-              'view',
-              _hoisted_1,
-              [
-                Object(vue__WEBPACK_IMPORTED_MODULE_0__[/* createVNode */ 'j'])(
-                  _component_nut_button,
-                  {
-                    type: 'primary',
-                    desc: '主要按钮',
-                    onClick: $setup.handleClick
-                  },
-                  {
-                    default: Object(
-                      vue__WEBPACK_IMPORTED_MODULE_0__[/* withCtx */ 'y']
-                    )(function() {
-                      return [_hoisted_2];
-                    }),
-                    _: 1
-                    /* STABLE */
-                  },
-                  8,
-                  /* PROPS */
-                  ['onClick']
-                )
-              ]
-            )
-          );
-        }
-
-        /***/
-      },
-
-    /***/ './src/pages/button-demo/index.vue':
-      /*!*****************************************!*\
-  !*** ./src/pages/button-demo/index.vue ***!
-  \*****************************************/
-      /*! no exports provided */
-      /*! all exports used */
-      /***/ function(module, __webpack_exports__, __webpack_require__) {
-        'use strict';
-        __webpack_require__.r(__webpack_exports__);
-        /* harmony import */ var _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
-          /*! @tarojs/runtime */ './node_modules/@tarojs/runtime/dist/runtime.esm.js'
-        );
-        /* harmony import */ var _node_modules_tarojs_taro_loader_lib_raw_js_index_vue__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(
-          /*! ../../../node_modules/@tarojs/taro-loader/lib/raw.js!./index.vue */ './node_modules/@tarojs/taro-loader/lib/raw.js!./src/pages/button-demo/index.vue'
-        );
-
-        var config = { navigationBarTitleText: 'button-demo' };
-
-        var inst = Page(
-          Object(
-            _tarojs_runtime__WEBPACK_IMPORTED_MODULE_0__['createPageConfig']
-          )(
-            _node_modules_tarojs_taro_loader_lib_raw_js_index_vue__WEBPACK_IMPORTED_MODULE_1__[
-              /* default */ 'a'
-            ],
-            'pages/button-demo/index',
-            { root: { cn: [] } },
-            config || {}
-          )
-        );
-
-        /***/
-      },
-
-    /***/ './src/pages/button-demo/index.vue?vue&type=script&lang=js':
-      /*!*****************************************************************!*\
-  !*** ./src/pages/button-demo/index.vue?vue&type=script&lang=js ***!
-  \*****************************************************************/
-      /*! exports provided: default */
-      /*! exports used: default */
-      /***/ function(module, __webpack_exports__, __webpack_require__) {
-        'use strict';
-        /* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_dist_index_js_ref_10_0_index_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
-          /*! -!../../../node_modules/babel-loader/lib!../../../node_modules/vue-loader/dist??ref--10-0!./index.vue?vue&type=script&lang=js */ './node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/dist/index.js?!./src/pages/button-demo/index.vue?vue&type=script&lang=js'
-        );
-        /* harmony reexport (safe) */ __webpack_require__.d(
-          __webpack_exports__,
-          'a',
-          function() {
-            return _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_dist_index_js_ref_10_0_index_vue_vue_type_script_lang_js__WEBPACK_IMPORTED_MODULE_0__[
-              'a'
-            ];
-          }
-        );
-
-        /***/
-      },
-
-    /***/ './src/pages/button-demo/index.vue?vue&type=template&id=2436f8cd':
-      /*!***********************************************************************!*\
-  !*** ./src/pages/button-demo/index.vue?vue&type=template&id=2436f8cd ***!
-  \***********************************************************************/
-      /*! exports provided: render */
-      /*! exports used: render */
-      /***/ function(module, __webpack_exports__, __webpack_require__) {
-        'use strict';
-        /* harmony import */ var _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_dist_templateLoader_js_ref_6_node_modules_vue_loader_dist_index_js_ref_10_0_index_vue_vue_type_template_id_2436f8cd__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
-          /*! -!../../../node_modules/babel-loader/lib!../../../node_modules/vue-loader/dist/templateLoader.js??ref--6!../../../node_modules/vue-loader/dist??ref--10-0!./index.vue?vue&type=template&id=2436f8cd */ './node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/dist/templateLoader.js?!./node_modules/vue-loader/dist/index.js?!./src/pages/button-demo/index.vue?vue&type=template&id=2436f8cd'
-        );
-        /* harmony reexport (safe) */ __webpack_require__.d(
-          __webpack_exports__,
-          'a',
-          function() {
-            return _node_modules_babel_loader_lib_index_js_node_modules_vue_loader_dist_templateLoader_js_ref_6_node_modules_vue_loader_dist_index_js_ref_10_0_index_vue_vue_type_template_id_2436f8cd__WEBPACK_IMPORTED_MODULE_0__[
-              'a'
-            ];
-          }
-        );
-
-        /***/
-      }
-  },
-  [
-    [
-      './src/pages/button-demo/index.vue',
-      'runtime',
-      'taro',
-      'vendors',
-      'common'
-    ]
-  ]
-]);
-//# sourceMappingURL=index.js.map

src/sites/mobile-taro/vue/dist/pages/button-demo/index.json

@@ -1 +0,0 @@
-{"navigationBarTitleText":"button-demo","usingComponents":{"custom-wrapper":"../../custom-wrapper","comp":"../../comp"}}

src/sites/mobile-taro/vue/dist/pages/button-demo/index.wxss

@@ -1,656 +0,0 @@
-view-block {
-  display: block;
-}
-@-webkit-keyframes nutFadeIn {
-from {
-    opacity: 0;
-}
-to {
-    opacity: 1;
-}
-}
-@keyframes nutFadeIn {
-from {
-    opacity: 0;
-}
-to {
-    opacity: 1;
-}
-}
-@-webkit-keyframes nutFadeOut {
-from {
-    opacity: 1;
-}
-to {
-    opacity: 0;
-}
-}
-@keyframes nutFadeOut {
-from {
-    opacity: 1;
-}
-to {
-    opacity: 0;
-}
-}
-.nutFade-enter-active,
-.nutFadeIn,
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutFade-enter-active,
-.nutFadeIn {
-  -webkit-animation-name: nutFadeIn;
-          animation-name: nutFadeIn;
-}
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-name: nutFadeOut;
-          animation-name: nutFadeOut;
-}
-@-webkit-keyframes nutZoomIn {
-from {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-50% {
-    opacity: 1;
-}
-}
-@keyframes nutZoomIn {
-from {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-50% {
-    opacity: 1;
-}
-}
-@-webkit-keyframes nutZoomOut {
-from {
-    opacity: 1;
-}
-50% {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-to {
-    opacity: 0;
-}
-}
-@keyframes nutZoomOut {
-from {
-    opacity: 1;
-}
-50% {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-to {
-    opacity: 0;
-}
-}
-.nutZoom-enter-active,
-.nutZoomIn,
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutZoom-enter-active,
-.nutZoomIn {
-  -webkit-animation-name: nutZoomIn;
-          animation-name: nutZoomIn;
-}
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-name: nutZoomOut;
-          animation-name: nutZoomOut;
-}
-@-webkit-keyframes nutEaseIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-}
-@keyframes nutEaseIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-}
-@-webkit-keyframes nutEaseOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-}
-@keyframes nutEaseOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-}
-.nutEase-enter-active,
-.nutEaseIn,
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutEase-enter-active,
-.nutEaseIn {
-  -webkit-animation-name: nutEaseIn;
-          animation-name: nutEaseIn;
-}
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-name: nutEaseOut;
-          animation-name: nutEaseOut;
-}
-@-webkit-keyframes nutDropIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-}
-@keyframes nutDropIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-}
-@-webkit-keyframes nutDropOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-}
-@keyframes nutDropOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-}
-.nutDrop-enter-active,
-.nutDropIn,
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutDrop-enter-active,
-.nutDropIn {
-  -webkit-animation-name: nutDropIn;
-          animation-name: nutDropIn;
-}
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-name: nutDropOut;
-          animation-name: nutDropOut;
-}
-@-webkit-keyframes rotation {
-0% {
-    -webkit-transform: rotate(0deg);
-}
-100% {
-    -webkit-transform: rotate(360deg);
-}
-}
-@keyframes rotation {
-0% {
-    -webkit-transform: rotate(0deg);
-}
-100% {
-    -webkit-transform: rotate(360deg);
-}
-}
-.nutRotate-enter-active,
-.nutRotateIn,
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutRotate-enter-active,
-.nutRotateIn {
-  -webkit-animation-name: nutRotateIn;
-          animation-name: nutRotateIn;
-}
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-name: nutRotateOut;
-          animation-name: nutRotateOut;
-}
-view-block {
-  display: block;
-}
-@keyframes nutFadeIn {
-from {
-    opacity: 0;
-}
-to {
-    opacity: 1;
-}
-}
-@keyframes nutFadeOut {
-from {
-    opacity: 1;
-}
-to {
-    opacity: 0;
-}
-}
-.nutFade-enter-active,
-.nutFadeIn,
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutFade-enter-active,
-.nutFadeIn {
-  -webkit-animation-name: nutFadeIn;
-          animation-name: nutFadeIn;
-}
-.nutFade-leave-active,
-.nutFadeOut {
-  -webkit-animation-name: nutFadeOut;
-          animation-name: nutFadeOut;
-}
-@keyframes nutZoomIn {
-from {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-50% {
-    opacity: 1;
-}
-}
-@keyframes nutZoomOut {
-from {
-    opacity: 1;
-}
-50% {
-    opacity: 0;
-    -webkit-transform: scale3d(0.3, 0.3, 0.3);
-            transform: scale3d(0.3, 0.3, 0.3);
-}
-to {
-    opacity: 0;
-}
-}
-.nutZoom-enter-active,
-.nutZoomIn,
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutZoom-enter-active,
-.nutZoomIn {
-  -webkit-animation-name: nutZoomIn;
-          animation-name: nutZoomIn;
-}
-.nutZoom-leave-active,
-.nutZoomOut {
-  -webkit-animation-name: nutZoomOut;
-          animation-name: nutZoomOut;
-}
-@keyframes nutEaseIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-}
-@keyframes nutEaseOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scale(1);
-            transform: scale(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scale(0.9);
-            transform: scale(0.9);
-}
-}
-.nutEase-enter-active,
-.nutEaseIn,
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutEase-enter-active,
-.nutEaseIn {
-  -webkit-animation-name: nutEaseIn;
-          animation-name: nutEaseIn;
-}
-.nutEase-leave-active,
-.nutEaseOut {
-  -webkit-animation-name: nutEaseOut;
-          animation-name: nutEaseOut;
-}
-@keyframes nutDropIn {
-0% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-100% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-}
-@keyframes nutDropOut {
-0% {
-    opacity: 1;
-    -webkit-transform: scaleY(1);
-            transform: scaleY(1);
-}
-100% {
-    opacity: 0;
-    -webkit-transform: scaleY(0.8);
-            transform: scaleY(0.8);
-}
-}
-.nutDrop-enter-active,
-.nutDropIn,
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutDrop-enter-active,
-.nutDropIn {
-  -webkit-animation-name: nutDropIn;
-          animation-name: nutDropIn;
-}
-.nutDrop-leave-active,
-.nutDropOut {
-  -webkit-animation-name: nutDropOut;
-          animation-name: nutDropOut;
-}
-@keyframes rotation {
-0% {
-    -webkit-transform: rotate(0deg);
-}
-100% {
-    -webkit-transform: rotate(360deg);
-}
-}
-.nutRotate-enter-active,
-.nutRotateIn,
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-duration: 0.25s;
-          animation-duration: 0.25s;
-  -webkit-animation-fill-mode: both;
-          animation-fill-mode: both;
-  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
-}
-.nutRotate-enter-active,
-.nutRotateIn {
-  -webkit-animation-name: nutRotateIn;
-          animation-name: nutRotateIn;
-}
-.nutRotate-leave-active,
-.nutRotateOut {
-  -webkit-animation-name: nutRotateOut;
-          animation-name: nutRotateOut;
-}
-.nut-button {
-  position: relative;
-  display: inline-block;
-  -webkit-flex-shrink: 0;
-      -ms-flex-negative: 0;
-          flex-shrink: 0;
-  height: 76rpx;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  margin: 0;
-  padding: 0;
-  line-height: 72rpx;
-  font-size: 28rpx;
-  text-align: center;
-  -webkit-transition: opacity 0.2s;
-  -o-transition: opacity 0.2s;
-  transition: opacity 0.2s;
-  -webkit-appearance: none;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
-  -ms-touch-action: manipulation;
-      touch-action: manipulation;
-}
-.nut-button .text {
-  margin-left: 10rpx;
-}
-.nut-button::before {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  width: 100%;
-  height: 100%;
-  background-color: #000;
-  border: inherit;
-  border-color: #000;
-  border-radius: inherit;
-  -webkit-transform: translate(-50%, -50%);
-      -ms-transform: translate(-50%, -50%);
-          transform: translate(-50%, -50%);
-  opacity: 0;
-  content: " ";
-}
-.nut-button:active::before {
-  opacity: 0.1;
-}
-.nut-button__warp {
-  height: 100%;
-  width: 100%;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-align-items: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-justify-content: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-}
-.nut-button--loading::before, .nut-button--disabled::before {
-  display: none;
-}
-.nut-button--default {
-  color: #666666;
-  background: #fff;
-  border: 2rpx solid #cccccc;
-}
-.nut-button--primary {
-  color: #fff;
-  background: -webkit-linear-gradient(315deg, #fa2c19 0%, #fa6419 100%);
-  background: -o-linear-gradient(315deg, #fa2c19 0%, #fa6419 100%);
-  background: linear-gradient(135deg, #fa2c19 0%, #fa6419 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--info {
-  color: #fff;
-  background: -webkit-linear-gradient(135deg, #498ff2 0%, #4965f2 100%);
-  background: -o-linear-gradient(135deg, #498ff2 0%, #4965f2 100%);
-  background: linear-gradient(315deg, #498ff2 0%, #4965f2 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--success {
-  color: #fff;
-  background: -webkit-linear-gradient(315deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
-  background: -o-linear-gradient(315deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
-  background: linear-gradient(135deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--danger {
-  color: #fff;
-  background: #fa2c19;
-  border: 2rpx solid transparent;
-}
-.nut-button--warning {
-  color: #fff;
-  background: -webkit-linear-gradient(315deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
-  background: -o-linear-gradient(315deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
-  background: linear-gradient(135deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
-  border: 2rpx solid transparent;
-}
-.nut-button--plain {
-  background: #fff;
-}
-.nut-button--plain.nut-button--primary {
-  color: #fa2c19;
-  border-color: #fa2c19;
-}
-.nut-button--plain.nut-button--info {
-  color: #496af2;
-  border-color: #496af2;
-}
-.nut-button--plain.nut-button--success {
-  color: #26bf26;
-  border-color: #26bf26;
-}
-.nut-button--plain.nut-button--danger {
-  color: #fa2c19;
-  border-color: #fa2c19;
-}
-.nut-button--plain.nut-button--warning {
-  color: #ff9e0d;
-  border-color: #ff9e0d;
-}
-.nut-button--large {
-  width: 100%;
-  height: 96rpx;
-  line-height: 92rpx;
-}
-.nut-button--normal {
-  padding: 0 36rpx;
-  font-size: 28rpx;
-}
-.nut-button--small {
-  height: 56rpx;
-  line-height: 52rpx;
-  padding: 0 24rpx;
-  font-size: 24rpx;
-}
-.nut-button--block {
-  display: block;
-  width: 100%;
-}
-.nut-button--disabled {
-  opacity: 0.68;
-}
-.nut-button--loading {
-  opacity: 0.9;
-}
-.nut-button--round {
-  border-radius: 50rpx;
-}
-.nut-button--square {
-  border-radius: 0;
-}

src/sites/mobile-taro/vue/dist/pages/button/demo.wxss

@@ -296,6 +296,662 @@ to {
   -webkit-animation-name: nutRotateOut;
           animation-name: nutRotateOut;
 }
+view-block {
+  display: block;
+}
+@keyframes nutFadeIn {
+from {
+    opacity: 0;
+}
+to {
+    opacity: 1;
+}
+}
+@keyframes nutFadeOut {
+from {
+    opacity: 1;
+}
+to {
+    opacity: 0;
+}
+}
+.nutFade-enter-active,
+.nutFadeIn,
+.nutFade-leave-active,
+.nutFadeOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutFade-enter-active,
+.nutFadeIn {
+  -webkit-animation-name: nutFadeIn;
+          animation-name: nutFadeIn;
+}
+.nutFade-leave-active,
+.nutFadeOut {
+  -webkit-animation-name: nutFadeOut;
+          animation-name: nutFadeOut;
+}
+@keyframes nutZoomIn {
+from {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+}
+50% {
+    opacity: 1;
+}
+}
+@keyframes nutZoomOut {
+from {
+    opacity: 1;
+}
+50% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+}
+to {
+    opacity: 0;
+}
+}
+.nutZoom-enter-active,
+.nutZoomIn,
+.nutZoom-leave-active,
+.nutZoomOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutZoom-enter-active,
+.nutZoomIn {
+  -webkit-animation-name: nutZoomIn;
+          animation-name: nutZoomIn;
+}
+.nutZoom-leave-active,
+.nutZoomOut {
+  -webkit-animation-name: nutZoomOut;
+          animation-name: nutZoomOut;
+}
+@keyframes nutEaseIn {
+0% {
+    opacity: 0;
+    -webkit-transform: scale(0.9);
+            transform: scale(0.9);
+}
+100% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+}
+}
+@keyframes nutEaseOut {
+0% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+}
+100% {
+    opacity: 0;
+    -webkit-transform: scale(0.9);
+            transform: scale(0.9);
+}
+}
+.nutEase-enter-active,
+.nutEaseIn,
+.nutEase-leave-active,
+.nutEaseOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutEase-enter-active,
+.nutEaseIn {
+  -webkit-animation-name: nutEaseIn;
+          animation-name: nutEaseIn;
+}
+.nutEase-leave-active,
+.nutEaseOut {
+  -webkit-animation-name: nutEaseOut;
+          animation-name: nutEaseOut;
+}
+@keyframes nutDropIn {
+0% {
+    opacity: 0;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+}
+100% {
+    opacity: 1;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+}
+}
+@keyframes nutDropOut {
+0% {
+    opacity: 1;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+}
+100% {
+    opacity: 0;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+}
+}
+.nutDrop-enter-active,
+.nutDropIn,
+.nutDrop-leave-active,
+.nutDropOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutDrop-enter-active,
+.nutDropIn {
+  -webkit-animation-name: nutDropIn;
+          animation-name: nutDropIn;
+}
+.nutDrop-leave-active,
+.nutDropOut {
+  -webkit-animation-name: nutDropOut;
+          animation-name: nutDropOut;
+}
+@keyframes rotation {
+0% {
+    -webkit-transform: rotate(0deg);
+}
+100% {
+    -webkit-transform: rotate(360deg);
+}
+}
+.nutRotate-enter-active,
+.nutRotateIn,
+.nutRotate-leave-active,
+.nutRotateOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutRotate-enter-active,
+.nutRotateIn {
+  -webkit-animation-name: nutRotateIn;
+          animation-name: nutRotateIn;
+}
+.nutRotate-leave-active,
+.nutRotateOut {
+  -webkit-animation-name: nutRotateOut;
+          animation-name: nutRotateOut;
+}
+.nut-button {
+  position: relative;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+      -ms-flex-negative: 0;
+          flex-shrink: 0;
+  height: 76rpx;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  line-height: 72rpx;
+  font-size: 28rpx;
+  text-align: center;
+  -webkit-transition: opacity 0.2s;
+  -o-transition: opacity 0.2s;
+  transition: opacity 0.2s;
+  -webkit-appearance: none;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+  -ms-touch-action: manipulation;
+      touch-action: manipulation;
+}
+.nut-button .text {
+  margin-left: 10rpx;
+}
+.nut-button::before {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 100%;
+  height: 100%;
+  background-color: #000;
+  border: inherit;
+  border-color: #000;
+  border-radius: inherit;
+  -webkit-transform: translate(-50%, -50%);
+      -ms-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+  opacity: 0;
+  content: " ";
+}
+.nut-button:active::before {
+  opacity: 0.1;
+}
+.nut-button__warp {
+  height: 100%;
+  width: 100%;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-justify-content: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+}
+.nut-button--loading::before, .nut-button--disabled::before {
+  display: none;
+}
+.nut-button--default {
+  color: #666666;
+  background: #fff;
+  border: 2rpx solid #cccccc;
+}
+.nut-button--primary {
+  color: #fff;
+  background: -webkit-linear-gradient(315deg, #fa2c19 0%, #fa6419 100%);
+  background: -o-linear-gradient(315deg, #fa2c19 0%, #fa6419 100%);
+  background: linear-gradient(135deg, #fa2c19 0%, #fa6419 100%);
+  border: 2rpx solid transparent;
+}
+.nut-button--info {
+  color: #fff;
+  background: -webkit-linear-gradient(135deg, #498ff2 0%, #4965f2 100%);
+  background: -o-linear-gradient(135deg, #498ff2 0%, #4965f2 100%);
+  background: linear-gradient(315deg, #498ff2 0%, #4965f2 100%);
+  border: 2rpx solid transparent;
+}
+.nut-button--success {
+  color: #fff;
+  background: -webkit-linear-gradient(315deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
+  background: -o-linear-gradient(315deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
+  background: linear-gradient(135deg, #26bf26 0%, #27c530 45%, #28cf3f 83%, #29d446 100%);
+  border: 2rpx solid transparent;
+}
+.nut-button--danger {
+  color: #fff;
+  background: #fa2c19;
+  border: 2rpx solid transparent;
+}
+.nut-button--warning {
+  color: #fff;
+  background: -webkit-linear-gradient(315deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
+  background: -o-linear-gradient(315deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
+  background: linear-gradient(135deg, #ff9e0d 0%, #ffa70d 45%, #ffb60d 83%, #ffbe0d 100%);
+  border: 2rpx solid transparent;
+}
+.nut-button--plain {
+  background: #fff;
+}
+.nut-button--plain.nut-button--primary {
+  color: #fa2c19;
+  border-color: #fa2c19;
+}
+.nut-button--plain.nut-button--info {
+  color: #496af2;
+  border-color: #496af2;
+}
+.nut-button--plain.nut-button--success {
+  color: #26bf26;
+  border-color: #26bf26;
+}
+.nut-button--plain.nut-button--danger {
+  color: #fa2c19;
+  border-color: #fa2c19;
+}
+.nut-button--plain.nut-button--warning {
+  color: #ff9e0d;
+  border-color: #ff9e0d;
+}
+.nut-button--large {
+  width: 100%;
+  height: 96rpx;
+  line-height: 92rpx;
+}
+.nut-button--normal {
+  padding: 0 36rpx;
+  font-size: 28rpx;
+}
+.nut-button--small {
+  height: 56rpx;
+  line-height: 52rpx;
+  padding: 0 24rpx;
+  font-size: 24rpx;
+}
+.nut-button--block {
+  display: block;
+  width: 100%;
+}
+.nut-button--disabled {
+  opacity: 0.68;
+}
+.nut-button--loading {
+  opacity: 0.9;
+}
+.nut-button--round {
+  border-radius: 50rpx;
+}
+.nut-button--square {
+  border-radius: 0;
+}
+view-block {
+  display: block;
+}
+@-webkit-keyframes nutFadeIn {
+from {
+    opacity: 0;
+}
+to {
+    opacity: 1;
+}
+}
+@keyframes nutFadeIn {
+from {
+    opacity: 0;
+}
+to {
+    opacity: 1;
+}
+}
+@-webkit-keyframes nutFadeOut {
+from {
+    opacity: 1;
+}
+to {
+    opacity: 0;
+}
+}
+@keyframes nutFadeOut {
+from {
+    opacity: 1;
+}
+to {
+    opacity: 0;
+}
+}
+.nutFade-enter-active,
+.nutFadeIn,
+.nutFade-leave-active,
+.nutFadeOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutFade-enter-active,
+.nutFadeIn {
+  -webkit-animation-name: nutFadeIn;
+          animation-name: nutFadeIn;
+}
+.nutFade-leave-active,
+.nutFadeOut {
+  -webkit-animation-name: nutFadeOut;
+          animation-name: nutFadeOut;
+}
+@-webkit-keyframes nutZoomIn {
+from {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+}
+50% {
+    opacity: 1;
+}
+}
+@keyframes nutZoomIn {
+from {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+}
+50% {
+    opacity: 1;
+}
+}
+@-webkit-keyframes nutZoomOut {
+from {
+    opacity: 1;
+}
+50% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+}
+to {
+    opacity: 0;
+}
+}
+@keyframes nutZoomOut {
+from {
+    opacity: 1;
+}
+50% {
+    opacity: 0;
+    -webkit-transform: scale3d(0.3, 0.3, 0.3);
+            transform: scale3d(0.3, 0.3, 0.3);
+}
+to {
+    opacity: 0;
+}
+}
+.nutZoom-enter-active,
+.nutZoomIn,
+.nutZoom-leave-active,
+.nutZoomOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutZoom-enter-active,
+.nutZoomIn {
+  -webkit-animation-name: nutZoomIn;
+          animation-name: nutZoomIn;
+}
+.nutZoom-leave-active,
+.nutZoomOut {
+  -webkit-animation-name: nutZoomOut;
+          animation-name: nutZoomOut;
+}
+@-webkit-keyframes nutEaseIn {
+0% {
+    opacity: 0;
+    -webkit-transform: scale(0.9);
+            transform: scale(0.9);
+}
+100% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+}
+}
+@keyframes nutEaseIn {
+0% {
+    opacity: 0;
+    -webkit-transform: scale(0.9);
+            transform: scale(0.9);
+}
+100% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+}
+}
+@-webkit-keyframes nutEaseOut {
+0% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+}
+100% {
+    opacity: 0;
+    -webkit-transform: scale(0.9);
+            transform: scale(0.9);
+}
+}
+@keyframes nutEaseOut {
+0% {
+    opacity: 1;
+    -webkit-transform: scale(1);
+            transform: scale(1);
+}
+100% {
+    opacity: 0;
+    -webkit-transform: scale(0.9);
+            transform: scale(0.9);
+}
+}
+.nutEase-enter-active,
+.nutEaseIn,
+.nutEase-leave-active,
+.nutEaseOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutEase-enter-active,
+.nutEaseIn {
+  -webkit-animation-name: nutEaseIn;
+          animation-name: nutEaseIn;
+}
+.nutEase-leave-active,
+.nutEaseOut {
+  -webkit-animation-name: nutEaseOut;
+          animation-name: nutEaseOut;
+}
+@-webkit-keyframes nutDropIn {
+0% {
+    opacity: 0;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+}
+100% {
+    opacity: 1;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+}
+}
+@keyframes nutDropIn {
+0% {
+    opacity: 0;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+}
+100% {
+    opacity: 1;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+}
+}
+@-webkit-keyframes nutDropOut {
+0% {
+    opacity: 1;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+}
+100% {
+    opacity: 0;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+}
+}
+@keyframes nutDropOut {
+0% {
+    opacity: 1;
+    -webkit-transform: scaleY(1);
+            transform: scaleY(1);
+}
+100% {
+    opacity: 0;
+    -webkit-transform: scaleY(0.8);
+            transform: scaleY(0.8);
+}
+}
+.nutDrop-enter-active,
+.nutDropIn,
+.nutDrop-leave-active,
+.nutDropOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutDrop-enter-active,
+.nutDropIn {
+  -webkit-animation-name: nutDropIn;
+          animation-name: nutDropIn;
+}
+.nutDrop-leave-active,
+.nutDropOut {
+  -webkit-animation-name: nutDropOut;
+          animation-name: nutDropOut;
+}
+@-webkit-keyframes rotation {
+0% {
+    -webkit-transform: rotate(0deg);
+}
+100% {
+    -webkit-transform: rotate(360deg);
+}
+}
+@keyframes rotation {
+0% {
+    -webkit-transform: rotate(0deg);
+}
+100% {
+    -webkit-transform: rotate(360deg);
+}
+}
+.nutRotate-enter-active,
+.nutRotateIn,
+.nutRotate-leave-active,
+.nutRotateOut {
+  -webkit-animation-duration: 0.25s;
+          animation-duration: 0.25s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+  -webkit-animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+          animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
+}
+.nutRotate-enter-active,
+.nutRotateIn {
+  -webkit-animation-name: nutRotateIn;
+          animation-name: nutRotateIn;
+}
+.nutRotate-leave-active,
+.nutRotateOut {
+  -webkit-animation-name: nutRotateOut;
+          animation-name: nutRotateOut;
+}
 .h2 {
   margin-top: 60rpx;
   margin-bottom: 20rpx;

src/sites/mobile-taro/vue/dist/pages/icon-demo/index.json

@@ -1 +0,0 @@
-{"navigationBarTitleText":"button-demo","usingComponents":{"custom-wrapper":"../../custom-wrapper","comp":"../../comp"}}

src/sites/mobile-taro/vue/dist/pages/icon-demo/index.wxml

@@ -1,2 +0,0 @@
-<import src="../../base.wxml"/>
-<template is="taro_tmpl" data="{{root:root}}" />

src/sites/mobile-taro/vue/dist/pages/inputnumber/demo.json

@@ -0,0 +1 @@
+{"usingComponents":{"custom-wrapper":"../../custom-wrapper","comp":"../../comp"}}

src/sites/mobile-taro/vue/src/app.config.ts

@@ -1,5 +1,8 @@
 export default {
-  pages: ['pages/button/demo'],
+  pages: [
+    // 'pages/inputnumber/demo',
+    'pages/button/demo'
+  ],
   window: {
     backgroundTextStyle: 'light',
     navigationBarBackgroundColor: '#fff',

src/sites/mobile-taro/vue/src/app.scss

@@ -0,0 +1,39 @@
+.demo {
+  height: 100%;
+  background: #f7f8fa;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 57px 17px 0 17px;
+
+  &.full {
+    padding: 57px 0 0 0;
+    h2 {
+      padding-left: 17px;
+    }
+  }
+
+  &.bg-w {
+    background: #fff;
+  }
+
+  &::-webkit-scrollbar {
+    width: 0;
+    background: transparent;
+  }
+  > h2 {
+    margin-top: 30px;
+    margin-bottom: 10px;
+    font-size: 14px;
+    color: rgba(144, 156, 164, 1);
+    padding: 0 10px;
+    font-weight: normal;
+  }
+  > p {
+    font-size: 12px;
+  }
+
+  .card {
+    padding: 25px 18px;
+    background: rgba(255, 255, 255, 1);
+  }
+}

src/sites/mobile-taro/vue/src/pages/cell/demo.vue

@@ -0,0 +1,61 @@
+<template>
+  <div class="demo">
+    <h2>基本用法</h2>
+    <nut-cell title="我是标题" desc="描述文字"></nut-cell>
+    <nut-cell
+      title="我是标题"
+      sub-title="副标题描述"
+      desc="描述文字"
+    ></nut-cell>
+    <nut-cell title="点击测试" @click="testClick"></nut-cell>
+
+    <h2>直接使用插槽(slot)</h2>
+
+    <nut-cell title="我是标题" desc="描述文字">
+      <div>自定义内容</div>
+    </nut-cell>
+
+    <nut-cell-group title="链接 | 分组用法">
+      <nut-cell title="链接" is-link></nut-cell>
+      <nut-cell
+        title="URL 跳转"
+        desc="https://jd.com"
+        is-link
+        url="https://jd.com"
+      ></nut-cell>
+      <nut-cell title="路由跳转 ’/‘ " to="/"></nut-cell>
+    </nut-cell-group>
+
+    <nut-cell-group title="自定义右侧箭头区域">
+      <nut-cell title="Switch">
+        <template v-slot:link>
+          <nut-switch v-model="switchChecked" />
+        </template>
+      </nut-cell>
+    </nut-cell-group>
+
+    <h2>展示图标</h2>
+    <nut-cell title="姓名" icon="my" desc="张三" isLink> </nut-cell>
+    <h2>只展示 desc ，可通过 desc-text-align 调整内容位置</h2>
+    <nut-cell desc-text-align="left" desc="张三"></nut-cell>
+  </div>
+</template>
+
+<script lang="ts">
+import { ref } from 'vue';
+import { createComponent } from './../../../../../../packages/utils/create';
+// import { Toast } from '@/packages/nutui.vue';
+const { createDemo } = createComponent('cell');
+export default createDemo({
+  setup() {
+    const testClick = (event: Event) => {
+      // Toast.text('点击事件');
+      console.log('点击事件');
+    };
+    const switchChecked = ref(true);
+    return { testClick, switchChecked };
+  }
+});
+</script>
+
+<style lang="scss"></style>

src/sites/mobile-taro/vue/src/pages/cell/index.taro.vue

@@ -34,9 +34,9 @@
 
 <script lang="ts">
 import { computed } from 'vue';
-import { createComponent } from '@/packages/utils/create';
+import { createComponent } from './../../../../../../packages/utils/create';
 import { useRouter } from 'vue-router';
-import CellGroup from '@/packages/__VUE/cellgroup/index.vue';
+import CellGroup from './../cellgroup/index.taro.vue';
 const { componentName, create } = createComponent('cell');
 export default create({
   props: {
@@ -84,5 +84,5 @@ export default create({
 </script>
 
 <style lang="scss">
-@import 'index.scss';
+@import '../../../../../../packages/__VUE/cell/index.scss';
 </style>

src/sites/mobile-taro/vue/src/pages/cellgroup/index.taro.vue

@@ -9,7 +9,7 @@
 
 <script lang="ts">
 import { computed } from 'vue';
-import { createComponent } from '@/packages/utils/create';
+import { createComponent } from './../../../../../../packages/utils/create';
 const { componentName, create } = createComponent('cell-group');
 export default create({
   props: {
@@ -30,5 +30,5 @@ export default create({
 </script>
 
 <style lang="scss">
-@import 'index.scss';
+@import '../../../../../../packages/__VUE/cellgroup/index.scss';
 </style>

src/sites/mobile-taro/vue/src/pages/inputnumber/demo.vue

@@ -0,0 +1,98 @@
+<template>
+  <div class="demo">
+    <h2>基本用法</h2>
+    <nut-cell>
+      <nut-inputnumber v-model="state.val1" />
+    </nut-cell>
+    <h2>步长设置</h2>
+    <nut-cell>
+      <nut-inputnumber v-model="state.val2" step="5" />
+    </nut-cell>
+    <h2>限制输入范围</h2>
+    <nut-cell>
+      <nut-inputnumber
+        v-model="state.val3"
+        @overlimit="overlimit"
+        min="10"
+        max="20"
+      />
+    </nut-cell>
+    <h2>禁用操作</h2>
+    <nut-cell>
+      <nut-inputnumber v-model="state.val4" disabled />
+    </nut-cell>
+    <h2>只读禁用输入框</h2>
+    <nut-cell>
+      <nut-inputnumber v-model="state.val5" readonly />
+    </nut-cell>
+    <h2>支持小数</h2>
+    <nut-cell>
+      <nut-inputnumber
+        v-model="state.val6"
+        step="0.1"
+        decimal-places="1"
+        readonly
+      />
+    </nut-cell>
+    <h2>支持异步修改</h2>
+    <nut-cell>
+      <nut-inputnumber :model-value="state.val8" @change="onChange" />
+    </nut-cell>
+    <h2>自定义按钮大小</h2>
+    <nut-cell>
+      <nut-inputnumber v-model="state.val7" button-size="30" input-width="50" />
+    </nut-cell>
+  </div>
+</template>
+
+<script lang="ts">
+import { reactive, getCurrentInstance } from 'vue';
+import { createComponent } from './../../../../../../packages/utils/create';
+import InputNumber from './index.taro.vue';
+import Cell from './../cell/index.taro.vue';
+const { createDemo } = createComponent('inputnumber');
+export default createDemo({
+  props: {},
+  components: {
+    'nut-inputnumber': InputNumber,
+    'nut-cell': Cell
+  },
+  setup() {
+    let { proxy } = getCurrentInstance();
+
+    const state = reactive({
+      val1: 1,
+      val2: 0,
+      val3: 10,
+      val4: 0,
+      val5: 1,
+      val6: 5.5,
+      val7: 1,
+      val8: 1,
+      step: 1.1
+    });
+
+    const onChange = (value: number) => {
+      console.log('异步演示 2 秒后更改');
+      // proxy.$toast.loading('异步演示 2 秒后更改');
+      setTimeout(() => {
+        state.val8 = value;
+        // proxy.$toast.hide();
+      }, 2000);
+    };
+
+    const overlimit = () => {
+      console.log('超出限制事件触发');
+      // proxy.$toast.warn('超出限制事件触发');
+    };
+
+    return {
+      state,
+      onChange,
+      overlimit
+    };
+  }
+});
+</script>
+
+<style lang="scss"></style>

src/sites/mobile-taro/vue/src/pages/inputnumber/index.taro.vue

@@ -8,7 +8,11 @@
       @click="reduce"
     >
     </nut-icon>
+    <view v-if="readonly" class="nut-inputnumber__text--readonly">
+      {{ modelValue }}
+    </view>
     <input
+      v-else
       type="number"
       :min="min"
       :max="max"
@@ -32,9 +36,11 @@
 </template>
 <script lang="ts">
 import { computed } from 'vue';
-import { createComponent } from '@/packages/utils/create';
-import { pxCheck } from '@/packages/utils/pxCheck';
+import { createComponent } from './../../../../../../packages/utils/create';
+import { pxCheck } from './../../../../../../packages/utils/pxCheck';
+import Icon from './../icon/index.taro.vue';
 const { componentName, create } = createComponent('inputnumber');
+// console.log(wx.canIUse('console.log'))
 export default create({
   props: {
     modelValue: {
@@ -74,6 +80,9 @@ export default create({
       default: false
     }
   },
+  components: {
+    'nut-icon': Icon
+  },
   emits: [
     'update:modelValue',
     'change',
@@ -99,7 +108,7 @@ export default create({
 
     const change = (event: Event) => {
       const input = event.target as HTMLInputElement;
-      emit('update:modelValue', input.valueAsNumber, event);
+      emit('update:modelValue', input.value, event);
     };
 
     const emitChange = (value: string | number, event: Event) => {
@@ -136,18 +145,12 @@ export default create({
       }
     };
 
-    const focus = (event: Event) => {
-      if (props.disabled) return;
-      if (props.readonly) return;
-      emit('focus', event);
-    };
-
     const blur = (event: Event) => {
       if (props.disabled) return;
       if (props.readonly) return;
       const input = event.target as HTMLInputElement;
 
-      let value = input.valueAsNumber;
+      let value = input.value;
 
       if (value < Number(props.min)) {
         value = Number(props.min);
@@ -158,6 +161,16 @@ export default create({
       emit('blur', event);
     };
 
+    const focus = (event: Event) => {
+      if (props.disabled) return;
+      if (props.readonly) {
+        console.log(12333);
+        blur();
+        return;
+      }
+      emit('focus', event);
+    };
+
     return {
       classes,
       change,
@@ -174,5 +187,5 @@ export default create({
 </script>
 
 <style lang="scss">
-@import 'index.scss';
+@import '../../../../../../packages/__VUE/inputnumber/index.scss';
 </style>