@nutui/nutui-react-taro 3.0.11 → 3.0.12

package/dist/cjs/packages/progress/style/style.harmony.css

@@ -0,0 +1,63 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-progress {
+  display: flex;
+  align-items: center;
+  position: relative;
+  width: 100%;
+}
+.nut-progress-outer {
+  flex: 1;
+  border-radius: 12px;
+  height: 10px;
+  background: #f2f3f5;
+}
+.nut-progress-outer .nut-progress-active:before {
+  content: "";
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  border-radius: 12px;
+  animation: progressActive 2s ease-in-out infinite;
+}
+.nut-progress-inner {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  transition: all 0.4s;
+  border-radius: 12px;
+  background: linear-gradient(135deg, #ff475d 0%, #ff0f23 100%);
+}
+.nut-progress-text {
+  display: flex;
+  align-items: center;
+  transition: all 0.4s;
+  margin-left: 12px;
+  color: #888b94;
+  font-family: PingFang SC;
+  font-size: 13px;
+}
+@keyframes progressActive {
+  0% {
+    background: rgba(255, 255, 255, 0.1);
+    width: 0;
+  }
+  20% {
+    background: rgba(255, 255, 255, 0.5);
+    width: 0;
+  }
+  to {
+    background: rgba(255, 255, 255, 0);
+    width: 100%;
+  }
+}
+
+[dir=rtl] .nut-progress-text,
+.nut-rtl .nut-progress-text {
+  transform: translate(50%);
+}

package/dist/cjs/packages/progress/style-jmapp/progress.scss

@@ -5,11 +5,10 @@
   width: 100%;
 
   &-outer {
-    flex: auto;
+    flex: 1;
     border-radius: $progress-border-radius;
     height: $progress-height;
     background: $progress-background;
-
     .nut-progress-active:before {
       content: '';
       position: absolute;
@@ -35,26 +34,11 @@
   &-text {
     display: flex;
     align-items: center;
-    position: absolute;
-    top: $progress-text-position-top;
-    bottom: $progress-text-position-bottom;
     transition: all 0.4s;
-    transform: translate(-50%);
-
-    &-inner {
-      display: flex;
-      flex-direction: row;
-      justify-content: center;
-      align-items: center;
-      height: 100%;
-      width: 100%;
-      color: $progress-text-color;
-      padding: $progress-text-padding;
-      border-radius: $progress-text-border-radius;
-      font-size: $progress-text-font-size;
-      line-height: 1;
-      background: $progress-text-background;
-    }
+    margin-left: 12px;
+    color: $color-text-help;
+    font-family: PingFang SC;
+    font-size: $progress-text-font-size;
   }
 
   @keyframes progressActive {

package/dist/cjs/packages/progress/style-jmapp/style.css

@@ -9,7 +9,7 @@
   width: 100%;
 }
 .nut-progress-outer {
-  flex: auto;
+  flex: 1;
   border-radius: var(--nutui-progress-border-radius, 12px);
   height: var(--nutui-progress-height, 10px);
   background: var(--nutui-progress-background, var(--nutui-color-surface-1));
@@ -36,25 +36,11 @@
 .nut-progress-text {
   display: flex;
   align-items: center;
-  position: absolute;
-  top: var(--nutui-progress-text-position-top, -4px);
-  bottom: var(--nutui-progress-text-position-bottom, -4px);
   transition: all 0.4s;
-  transform: translate(-50%);
-}
-.nut-progress-text-inner {
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  width: 100%;
-  color: var(--nutui-progress-text-color, var(--nutui-color-text-dark));
-  padding: var(--nutui-progress-text-padding, 0 5px);
-  border-radius: var(--nutui-progress-text-border-radius, 5px);
+  margin-left: 12px;
+  color: var(--nutui-color-text-help);
+  font-family: PingFang SC;
   font-size: var(--nutui-progress-text-font-size, 9px);
-  line-height: 1;
-  background: var(--nutui-progress-text-background, #ff0f23);
 }
 @keyframes progressActive {
   0% {

package/dist/cjs/packages/progress/style-jrkf/progress.scss

@@ -5,11 +5,10 @@
   width: 100%;
 
   &-outer {
-    flex: auto;
+    flex: 1;
     border-radius: $progress-border-radius;
     height: $progress-height;
     background: $progress-background;
-
     .nut-progress-active:before {
       content: '';
       position: absolute;
@@ -35,26 +34,11 @@
   &-text {
     display: flex;
     align-items: center;
-    position: absolute;
-    top: $progress-text-position-top;
-    bottom: $progress-text-position-bottom;
     transition: all 0.4s;
-    transform: translate(-50%);
-
-    &-inner {
-      display: flex;
-      flex-direction: row;
-      justify-content: center;
-      align-items: center;
-      height: 100%;
-      width: 100%;
-      color: $progress-text-color;
-      padding: $progress-text-padding;
-      border-radius: $progress-text-border-radius;
-      font-size: $progress-text-font-size;
-      line-height: 1;
-      background: $progress-text-background;
-    }
+    margin-left: 12px;
+    color: $color-text-help;
+    font-family: PingFang SC;
+    font-size: $progress-text-font-size;
   }
 
   @keyframes progressActive {

package/dist/cjs/packages/progress/style-jrkf/style.css

@@ -9,7 +9,7 @@
   width: 100%;
 }
 .nut-progress-outer {
-  flex: auto;
+  flex: 1;
   border-radius: var(--nutui-progress-border-radius, 12px);
   height: var(--nutui-progress-height, 10px);
   background: var(--nutui-progress-background, var(--nutui-color-surface-1));
@@ -36,25 +36,11 @@
 .nut-progress-text {
   display: flex;
   align-items: center;
-  position: absolute;
-  top: var(--nutui-progress-text-position-top, -4px);
-  bottom: var(--nutui-progress-text-position-bottom, -4px);
   transition: all 0.4s;
-  transform: translate(-50%);
-}
-.nut-progress-text-inner {
-  display: flex;
-  flex-direction: row;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-  width: 100%;
-  color: var(--nutui-progress-text-color, var(--nutui-color-text-dark));
-  padding: var(--nutui-progress-text-padding, 0 5px);
-  border-radius: var(--nutui-progress-text-border-radius, 5px);
+  margin-left: 12px;
+  color: var(--nutui-color-text-help);
+  font-family: PingFang SC;
   font-size: var(--nutui-progress-text-font-size, 9px);
-  line-height: 1;
-  background: var(--nutui-progress-text-background, var(--nutui-progress-color, linear-gradient(135deg, var(--nutui-color-primary-stop-1, #ff9999) 0%, var(--nutui-color-primary-stop-2, #ff6666) 100%)));
 }
 @keyframes progressActive {
   0% {

package/dist/cjs/packages/pulltorefresh/style/style.harmony.css

@@ -0,0 +1,43 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-pulltorefresh-head {
+  overflow: hidden;
+  position: relative;
+  font-size: 12px;
+}
+.nut-pulltorefresh-head-content {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  color: #888b94;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+.nut-pulltorefresh-head-content-icons {
+  width: 36px;
+  height: 26px;
+  margin-bottom: 4px;
+}
+.nut-pulltorefresh-primary {
+  background: #ff0f23;
+}
+.nut-pulltorefresh-primary-content {
+  color: rgba(255, 255, 255, 0.9);
+}
+.nut-pulltorefresh-primary-head-content {
+  color: rgba(255, 255, 255, 0.9);
+}
+.nut-pulltorefresh-primary-status-text {
+  color: #ffffff;
+}
+
+[dir=rtl] .nut-pulltorefresh-head-content,
+.nut-rtl .nut-pulltorefresh-head-content {
+  left: auto;
+  right: 0;
+}

package/dist/cjs/packages/radio/style/style.harmony.css

@@ -0,0 +1,90 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-radio {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+}
+.nut-radio.nut-radio-reverse {
+  flex-direction: row-reverse;
+}
+.nut-radio.nut-radio-reverse .nut-radio-label {
+  margin-right: 4px;
+  margin-left: 0;
+}
+.nut-radio-label {
+  margin-left: 4px;
+  font-size: 12px;
+  color: #1a1a1a;
+}
+.nut-radio-label-disabled {
+  color: #c2c4cc;
+}
+.nut-radio-icon {
+  color: #c2c4cc;
+  transition-duration: 0.3s;
+  transition-property: color, border-color, background-color;
+  font-size: 16px;
+}
+.nut-radio-icon-checked {
+  color: #ff0f23;
+  box-shadow: 0px 2px 4px 0px rgba(255, 15, 35, 0.2);
+  border-radius: 50%;
+}
+.nut-radio-icon-checked.nut-radio-icon-disabled {
+  color: #ffadbe;
+  box-shadow: none;
+}
+.nut-radio-icon-disabled {
+  color: #c2c4cc;
+}
+.nut-radio-button {
+  display: inline-flex;
+  align-items: center;
+  min-height: 30px;
+  padding: 5px 18px;
+  font-size: 12px;
+  background: rgba(250, 44, 25, 0.05);
+  border-radius: 15px;
+  color: #1a1a1a;
+  box-sizing: border-box;
+  border: 1px solid rgba(250, 44, 25, 0.05);
+}
+.nut-radio-button-active {
+  background: #ffebf1;
+  color: #ff0f23;
+  border: 1px solid #ff0f23;
+}
+.nut-radio-button-disabled {
+  color: #c2c4cc;
+  border: 1px solid rgba(250, 44, 25, 0.05);
+}
+.nut-radio .nut-radio-button-active.nut-radio-button-disabled {
+  background: #c2c4cc;
+  color: #ffffff;
+  border: 1px solid #c2c4cc;
+}
+
+[dir=rtl] .nut-radio:last-child,
+.nut-rtl .nut-radio:last-child {
+  margin-right: 0 !important;
+  margin-left: 0 !important;
+}
+[dir=rtl] .nut-radio.nut-radio-reverse .nut-radio-label {
+  margin-left: 4px;
+  margin-right: 0;
+}
+.nut-rtl .nut-radio.nut-radio-reverse .nut-radio-label {
+  margin-left: 4px;
+  margin-right: 0;
+}
+[dir=rtl] .nut-radio-label {
+  margin-left: 0;
+  margin-right: 4px;
+}
+.nut-rtl .nut-radio-label {
+  margin-left: 0;
+  margin-right: 4px;
+}

package/dist/cjs/packages/radiogroup/style/style.harmony.css

@@ -0,0 +1,55 @@
+/* #ifdef harmony */
+/* #endif */
+/* #ifndef harmony */
+/* #endif */
+.nut-radiogroup .nut-radio {
+  margin: 0 20px 5px 0;
+}
+.nut-radiogroup .nut-radio-label {
+  margin: 0 5px;
+}
+.nut-radiogroup .nut-radio-button {
+  background-color: rgba(250, 44, 25, 0.05);
+}
+.nut-radiogroup .nut-radio:last-child {
+  margin: 0;
+}
+.nut-radiogroup-vertical .nut-radio.nut-radio-reverse {
+  width: 100%;
+  justify-content: space-between;
+}
+.nut-radiogroup-vertical .nut-radio-button {
+  border: 1px solid rgba(250, 44, 25, 0.05);
+}
+.nut-radiogroup-vertical .nut-radio-button-active {
+  border: 1px solid #ff0f23;
+  background-color: #ffebf1;
+}
+.nut-radiogroup-horizontal {
+  display: flex;
+}
+.nut-radiogroup-horizontal .nut-radio-button {
+  border: 1px solid #ffffff;
+}
+.nut-radiogroup-horizontal .nut-radio-button-active {
+  border: 1px solid #ff0f23;
+  background-color: #ffebf1;
+}
+.nut-radiogroup-horizontal .nut-radio:last-child {
+  margin: 0 20px 5px 0;
+}
+.nut-radiogroup .nut-radio-button-active.nut-radio-button-disabled {
+  background: #c2c4cc;
+  color: #ffffff;
+  border: 1px solid #c2c4cc;
+}
+
+[dir=rtl] .nut-radiogroup .nut-radio {
+  margin-left: 20px;
+  margin-right: 0;
+}
+
+.nut-rtl .nut-radiogroup .nut-radio {
+  margin-left: 20px;
+  margin-right: 0;
+}