@nutui/nutui 3.2.0 → 3.2.2

package/dist/packages/address/index.scss

@@ -72,6 +72,7 @@
       color: #1d1e1e;
 
       .tab-item {
+        position: relative;
         min-width: 2px;
         margin-right: 30px;
         display: block;
@@ -94,6 +95,22 @@
           overflow: hidden;
           text-overflow: ellipsis;
         }
+
+        .region-tab-line-mini {
+          position: absolute;
+          bottom: -10px;
+          left: 0px;
+          display: inline-block;
+          margin-top: 5px;
+          width: 0;
+          height: 3px;
+          background: $address-region-tab-line;
+          transition: 0.2s all linear;
+
+          &.active {
+            width: 26px;
+          }
+        }
       }
 
       .region-tab-line {

package/dist/packages/addresslist/index.scss

@@ -1,3 +1,43 @@
+.nut-theme-dark {
+  .nut-addresslist {
+    .nut-long-press-shell {
+      &__contain {
+        background-color: $dark-background2;
+        border-bottom: 1px solid $dark-color-gray;
+        color: $dark-color;
+        &-mask {
+          background-color: $dark-color3;
+          &-copy {
+            color: $dark-color-gray;
+            background-color: $dark-color;
+          }
+        }
+      }
+    }
+    .nut-swipe-shell,
+    .nut-general-shell {
+      background-color: $dark-background2;
+      border-bottom: 1px solid $dark-color-gray;
+      color: $dark-color;
+    }
+    .nut-item-contents {
+      &__info {
+        &-contact {
+          &-default {
+            background: $addresslist-contnts-contact-default;
+            color: $addresslist-contnts-contact-color;
+          }
+        }
+      }
+      &__addr {
+        color: $dark-color-gray;
+      }
+    }
+    &__bottom {
+      background-color: $dark-background2;
+    }
+  }
+}
 .nut-addresslist {
   overflow: hidden;
   .nut-long-press-shell {
@@ -5,10 +45,10 @@
       width: 100%;
       min-height: 76px;
       padding: 5px 10px;
-      background-color: #fff;
-      border-bottom: 1px solid #f0f0f0;
-      color: #333333;
-      font-size: 16px;
+      background-color: $addresslist-bg;
+      border-bottom: 1px solid $addresslist-border;
+      color: $addresslist-font-color;
+      font-size: $addresslist-font-size;
       display: flex;
       align-items: center;
       position: relative;
@@ -19,7 +59,7 @@
         left: 0;
         bottom: 0;
         right: 0;
-        background-color: rgba(0, 0, 0, 0.4);
+        background-color: $addresslist-mask-bg;
         display: flex;
         justify-content: space-around;
         align-items: center;
@@ -32,19 +72,19 @@
           width: 55px;
           border-radius: 50%;
           text-align: center;
-          background-color: #fff;
+          background-color: $white;
           font-size: 14px;
           display: flex;
           justify-content: center;
           align-items: center;
         }
         &-set {
-          color: #fff;
-          background-color: #f5a623;
+          color: $white;
+          background-color: $addresslist-set-bg;
         }
         &-del {
-          color: #fff;
-          background-color: #e1251b;
+          color: $white;
+          background-color: $addresslist-del-bg;
         }
       }
     }
@@ -69,10 +109,10 @@
     // width:100%;
     min-height: 76px;
     padding: 5px 10px;
-    background-color: #fff;
-    border-bottom: 1px solid #f0f0f0;
-    color: #333333;
-    font-size: 16px;
+    background-color: $addresslist-bg;
+    border-bottom: 1px solid $addresslist-border;
+    color: $addresslist-font-color;
+    font-size: $addresslist-font-size;
     display: flex;
     align-items: center;
     position: relative;
@@ -120,8 +160,8 @@
       }
     }
     &__addr {
-      color: #666666;
-      font-size: 12px;
+      color: $addresslist-addr-font-color;
+      font-size: $addresslist-addr-font-size;
       margin-top: 5px;
     }
   }
@@ -135,7 +175,7 @@
     width: 100%;
     padding: 12px 18px 24px;
     z-index: 100000;
-    background-color: #fff;
+    background-color: $addresslist-bg;
     box-sizing: border-box;
   }
 }

package/dist/packages/button/index.scss

@@ -15,6 +15,7 @@
   appearance: none;
   user-select: none;
   touch-action: manipulation;
+  vertical-align: bottom;
 
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   -webkit-tap-highlight-color: transparent;

package/dist/packages/category/index.scss

@@ -1,3 +1,24 @@
+.nut-theme-dark {
+  .nut-category {
+    &__cateList {
+      background: $dark-background2;
+    }
+
+    &__cateListLeft {
+      background: $dark-background4;
+    }
+    &__cateListItem {
+      color: $dark-color-gray;
+    }
+    &__cateListItemChecked {
+      color: $dark-color;
+      background: $dark-background2;
+      &::before {
+        background: $category-list-item-checked-img-bg-color;
+      }
+    }
+  }
+}
 .nut-category {
   &__cateList {
     display: flex;
@@ -5,7 +26,7 @@
   }
 
   &__cateListLeft {
-    background: $category-ListLeft-bg-color;
+    background: $category-list-left-bg-color;
   }
 
   &__cateListItemChecked,
@@ -15,14 +36,14 @@
     font-size: 13px;
     font-family: PingFangSC;
     font-weight: normal;
-    color: $category-ListItem-color;
+    color: $category-list-item-color;
     display: flex;
     justify-content: center;
     align-items: center;
     transition: all 0.3s;
   }
   &__cateListItemChecked {
-    background: $category-ListItemChecked-color;
+    background: $category-list-item-checked-color;
     font-weight: 500;
     transition: all 0.3s;
     position: relative;
@@ -32,7 +53,7 @@
       left: 0;
       width: 5px;
       height: 18px;
-      background: $category-ListItemChecked-img-bg-color;
+      background: $category-list-item-checked-img-bg-color;
     }
   }
 }

package/dist/packages/categorypane/index.scss

@@ -1,44 +1,25 @@
-.nut-categorypane {
-  &__cateList {
-    display: flex;
-    background: rgba(255, 255, 255, 1);
-  }
-
-  &__cateListLeft {
-    background: rgba(246, 247, 249, 1);
-  }
-
-  &__cateListItemChecked,
-  &__cateListItem {
-    width: 100px;
-    height: 50px;
-    font-size: 13px;
-    font-family: PingFangSC;
-    font-weight: normal;
-    color: rgba(51, 51, 51, 1);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    transition: all 0.3s;
-  }
-  &__cateListItemChecked {
-    background: rgba(255, 255, 255, 1);
-    font-weight: 500;
-    transition: all 0.3s;
+.nut-theme-dark {
+  .nut-categorypane {
+    &__childTitle {
+      color: $white;
+    }
+    &__cateListRight {
+      background: $dark-background2;
+    }
   }
-
+}
+.nut-categorypane {
   &__cateListRight {
     padding-left: 15px;
-    background: rgba(255, 255, 255, 1);
+    background: $category-bg-color;
   }
-
   &__childTitle {
     margin-top: 15px;
     margin-bottom: 15px;
     font-size: 13px;
     font-family: PingFangSC;
     font-weight: 500;
-    color: rgba(51, 51, 51, 1);
+    color: $category-pane-title-color;
   }
 
   &__childItemList {
@@ -56,18 +37,21 @@
   }
 
   &__skuName {
+    margin-left: 15px;
+    margin-top: 15px;
     margin-right: 10px;
     width: 75px;
     height: 40px;
-    border: 1px solid rgba(153, 153, 153, 1);
+    border: 1px solid $category-pane-border-color;
     border-radius: 5px;
     font-size: 12px;
     font-family: PingFangSC;
     font-weight: normal;
-    color: rgba(102, 102, 102, 1);
+    color: $category-pane-gray-color;
     display: flex;
     justify-content: center;
     align-items: center;
+
     &:nth-child(3n) {
       margin-right: 0;
     }
@@ -80,7 +64,7 @@
     font-size: 12px;
     font-family: PingFangSC;
     font-weight: normal;
-    color: rgba(102, 102, 102, 1);
+    color: $category-pane-gray-color;
     margin-top: 10px;
     margin-bottom: 10px;
     text-align: center;
@@ -90,35 +74,4 @@
     display: flex;
     flex-wrap: wrap;
   }
-  &__selfskuName {
-    margin-left: 15px;
-    margin-top: 15px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 75px;
-    height: 40px;
-    border: 1px solid rgba(153, 153, 153, 1);
-    border-radius: 5px;
-    font-size: 12px;
-    font-family: PingFangSC;
-    font-weight: normal;
-    color: rgba(102, 102, 102, 1);
-  }
-
-  &__skuName {
-    margin-left: 15px;
-    margin-top: 15px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 75px;
-    height: 40px;
-    border: 1px solid rgba(153, 153, 153, 1);
-    border-radius: 5px;
-    font-size: 12px;
-    font-family: PingFangSC;
-    font-weight: normal;
-    color: rgba(102, 102, 102, 1);
-  }
 }

package/dist/packages/fixednav/index.scss

@@ -83,6 +83,13 @@
       align-items: center;
       min-width: 50px;
       flex-shrink: 0;
+
+      &.active {
+        > .span {
+          color: $fixednav-item-active-color;
+        }
+      }
+
       > img {
         width: 20px;
         height: 20px;

package/dist/packages/invoice/index.scss

@@ -0,0 +1,33 @@
+.nut-theme-dark {
+  .nut-invoice {
+    .nut-invoice__submit {
+      background: $dark-background2;
+    }
+  }
+}
+
+.nut-invoice {
+  width: 100%;
+  position: relative;
+  .nut-cell {
+    align-items: baseline;
+  }
+  &__submit {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    padding: $invoice-padding;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #fff;
+    box-sizing: border-box;
+    bottom: constant(safe-area-inset-bottom);
+    bottom: env(safe-area-inset-bottom);
+  }
+  .nut-radio {
+    display: inline-block;
+    margin-right: 6px;
+    margin-bottom: 0;
+  }
+}

package/dist/packages/locale/lang/baseLang.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.2.0 Mon Aug 01 2022 21:25:37 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.2.2 Thu Sep 08 2022 22:10:47 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/locale/lang/en-US.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.2.0 Mon Aug 01 2022 21:25:37 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.2.2 Thu Sep 08 2022 22:10:47 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/locale/lang/id-ID.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.2.0 Mon Aug 01 2022 21:25:37 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.2.2 Thu Sep 08 2022 22:10:47 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/locale/lang/index.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.2.0 Mon Aug 01 2022 21:25:37 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.2.2 Thu Sep 08 2022 22:10:47 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/locale/lang/zh-CN.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.2.0 Mon Aug 01 2022 21:25:37 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.2.2 Thu Sep 08 2022 22:10:47 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/locale/lang/zh-TW.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.2.0 Mon Aug 01 2022 21:25:37 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.2.2 Thu Sep 08 2022 22:10:47 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/menu/index.scss

@@ -1,8 +1,20 @@
+.nut-theme-dark {
+  .nut-menu {
+    .nut-menu__bar {
+      background-color: $dark-background;
+
+      .nut-menu__item {
+        color: $dark-color;
+      }
+    }
+  }
+}
+
 .nut-menu {
   &.scroll-fixed {
     position: fixed;
-    top: $nut-menu-scroll-fixed-top;
-    z-index: $nut-menu-scroll-fixed-z-index;
+    top: $menu-scroll-fixed-top;
+    z-index: $menu-scroll-fixed-z-index;
     width: 100%;
   }
 

package/dist/packages/menuitem/index.scss

@@ -1,3 +1,11 @@
+.nut-theme-dark {
+  .nut-menu-item__content {
+    .nut-menu-item__option {
+      color: $dark-color;
+    }
+  }
+}
+
 .nut-menu-item {
   .active {
     font-weight: 500;
@@ -8,9 +16,11 @@
 .nut-menu-item__content {
   padding: $menu-item-content-padding;
   max-height: $menu-item-content-max-height;
-  overflow-y: auto;
   display: flex;
   flex-wrap: wrap;
+  &.nut-menu-item__overflow {
+    overflow-y: auto;
+  }
 
   .nut-menu-item__option {
     color: $title-color;

package/dist/packages/navbar/index.scss

@@ -40,6 +40,12 @@
     padding-top: constant(safe-area-inset-top);
     padding-top: env(safe-area-inset-top);
   }
+  &--fixed {
+    &.nut-navbar--safe-area-inset-top {
+      height: calc($navbar-height + constant(safe-area-inset-top));
+      height: calc($navbar-height + env(safe-area-inset-top));
+    }
+  }
   &--clickable {
     &::before {
       position: absolute;
@@ -110,10 +116,6 @@
   &__left {
     font-size: $cell-desc-font;
     color: $cell-desc-color;
-    position: absolute;
-    left: 0;
-    top: 0;
-    bottom: 0;
     display: flex;
     align-items: center;
     cursor: pointer;
@@ -122,10 +124,6 @@
   &__right {
     font-size: $cell-desc-font;
     color: $cell-desc-color;
-    position: absolute;
-    right: 0;
-    top: 0;
-    bottom: 0;
     display: flex;
     align-items: center;
     padding: 0 16px;

package/dist/packages/picker/index.scss

@@ -46,6 +46,7 @@
     align-items: center;
     justify-content: center;
     min-width: 50px;
+    height: 100%;
   }
   &__left {
     color: $picker-cancel-color;
@@ -126,6 +127,9 @@
       line-height: $picker-item-height;
       color: $picker-item-text-color;
       font-size: $picker-item-text-font-size;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
 
       &-hidden {
         visibility: hidden;
@@ -140,6 +144,10 @@
       line-height: $picker-item-height;
       color: $picker-item-text-color;
       font-size: $picker-item-text-font-size;
+
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
     }
   }
 

package/dist/packages/price/index.scss

@@ -1,5 +1,5 @@
 .nut-price {
-  font-size: $font-size-3;
+  font-size: 0;
   display: inline;
   color: $primary-color;
   &--symbol {

package/dist/packages/radio/index.scss

@@ -55,6 +55,7 @@
   }
 
   &__label {
+    flex: 1;
     margin-left: $radio-label-margin-left;
     font-size: $radio-label-font-size;
     color: $radio-label-font-color;

package/dist/packages/searchbar/index.scss

@@ -26,6 +26,7 @@
   padding: $searchbar-padding;
   background: $searchbar-background;
   box-sizing: border-box;
+
   &__search-label {
     padding: 0 5px;
     color: #323233;
@@ -40,6 +41,7 @@
     border-radius: $searchbar-input-border-radius;
     box-shadow: $searchbar-input-box-shadow;
     background: $searchbar-input-background;
+    box-sizing: border-box;
 
     .nut-searchbar__input-inner {
       display: flex;

package/dist/packages/step/index.scss

@@ -119,6 +119,58 @@
     }
   }
 }
+.nut-steps-horizontal {
+  &.nut-steps-dot {
+    .nut-step-head {
+      margin-top: 7px;
+      margin-bottom: 0;
+    }
+    .nut-step-line {
+      top: 50%;
+      bottom: -50%;
+    }
+    .nut-step-icon {
+      width: 8px;
+      height: 8px;
+      background: $primary-color;
+      border-radius: 50%;
+      box-sizing: content-box;
+    }
+    .nut-step-wait {
+      .nut-step-icon {
+        background-color: $steps-wait-icon-bg-color;
+      }
+      .nut-step-content {
+        color: $steps-wait-content-color;
+      }
+    }
+    .nut-step-finish {
+      .nut-step-icon {
+        background-color: $primary-color;
+      }
+    }
+    .nut-step-process {
+      .nut-step-icon {
+        position: relative;
+        background-color: $primary-color;
+        &:before {
+          content: '';
+          display: inline-block;
+          position: absolute;
+          left: 50%;
+          top: 50%;
+          margin-left: -7px;
+          margin-top: -7px;
+          width: 14px;
+          height: 14px;
+          background-color: $primary-color-end;
+          border-radius: 50%;
+          opacity: 0.23;
+        }
+      }
+    }
+  }
+}
 .nut-steps-vertical {
   .nut-step {
     display: flex;

package/dist/packages/swiper/index.scss

@@ -5,6 +5,8 @@
   transition-property: transform;
   box-sizing: content-box;
   overflow: hidden;
+  cursor: grab;
+  user-select: none;
   &-inner {
     display: flex;
     height: 100%;

package/dist/packages/swiperitem/index.scss

@@ -1,3 +1,6 @@
 .nut-swiper-item {
   height: 100%;
+  img {
+    pointer-events: none;
+  }
 }