@nutui/nutui-react 2.3.6 → 2.3.8-beta.0

package/dist/packages/dialog/dialog.scss

@@ -32,6 +32,31 @@
     animation-duration: 0.3s;
   }
 
+  &-close {
+    position: absolute !important;
+    z-index: 1;
+    cursor: pointer;
+    width: $dialog-close-width;
+    height: $dialog-close-height;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    top: $dialog-close-top;
+    color: $dialog-close-color;
+
+    &-top-right {
+      right: $dialog-close-right;
+    }
+
+    &-top-left {
+      left: $dialog-close-left;
+    }
+
+    &:active {
+      opacity: 0.7;
+    }
+  }
+
   &-header {
     display: block;
     text-align: center;

package/dist/packages/imagepreview/imagepreview.scss

@@ -26,6 +26,30 @@
     }
   }
 
+  &-close {
+    position: fixed;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 2002;
+    background: transparent;
+    color: $white;
+    &.top-right {
+      top: 50px;
+      right: 20px;
+    }
+    &.top-left {
+      top: 50px;
+      left: 20px;
+    }
+    &.bottom {
+      bottom: 50px;
+      left: 0;
+      right: 0;
+      text-align: center;
+    }
+  }
+
   &-pop {
     height: 100%;
     background: transparent !important;

package/dist/packages/popover/popover.scss

@@ -96,7 +96,7 @@
       border-bottom: 1px solid $popover-divider-color;
 
       &:last-child {
-        margin-bottom: 2px;
+        margin-bottom: 0px;
         border-bottom: none;
       }
 

package/dist/packages/rate/rate.scss

@@ -30,9 +30,14 @@
       left: 0;
       top: 0;
       overflow: hidden;
+
+      .nut-icon {
+        flex-shrink: 0;
+      }
     }
 
     &-icon {
+      display: flex;
       color: $rate-icon-color;
       cursor: pointer;
 

package/dist/packages/table/table.scss

@@ -8,9 +8,14 @@
     flex-direction: column;
     font-size: $font-size-base;
     color: $color-title;
-    overflow: auto;
+    overflow-y: auto;
+    overflow-x: hidden;
     position: relative;
     border: 1px solid $table-border-color;
+
+    &-sticky {
+      overflow-x: auto;
+    }
   }
 
   &-main {
@@ -61,6 +66,7 @@
         &-th {
           display: table-cell;
           padding: $table-cols-padding;
+          table-layout: fixed;
           background: inherit;
           position: sticky;
           top: 0;
@@ -77,6 +83,7 @@
         &-td {
           display: table-cell;
           padding: $table-cols-padding;
+          table-layout: fixed;
           background: inherit;
 
           &:last-child {
@@ -149,6 +156,10 @@
   &-fixed-right {
     position: sticky;
     z-index: 2;
+    &.h5-div {
+      // 临时方案，小程序下，width包含了padding值。
+      padding: $table-cols-padding 0;
+    }
   }
   &-fixed-left-last {
     border-right: none;

package/dist/packages/tabs/tabs.scss

@@ -192,12 +192,19 @@
 
 .nut-tabs-horizontal {
   flex-direction: column;
+  position: relative;
 }
 
 .nut-tabs-vertical {
   flex-direction: row;
   width: 100%;
 
+  .nut-tabs-ellipsis {
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+
   .nut-tabs-titles {
     box-sizing: border-box;
     flex-direction: column;
@@ -212,6 +219,12 @@
       flex-direction: column;
       flex-shrink: 0;
     }
+
+    &-line {
+      .nut-tabs-titles-item {
+        padding-left: 14px;
+      }
+    }
   }
 
   .nut-tabs-titles-scrollable {
@@ -235,6 +248,9 @@
       height: 0;
       transform: translate(0, -50%);
       transition: height 0.3s ease;
+      &-vertical {
+        top: 50%;
+      }
     }
 
     &-active {
@@ -248,7 +264,7 @@
       }
 
       .nut-tabs-titles-item-smile {
-        right: -6px;
+        right: -12px;
         bottom: -2%;
         left: auto;
         width: 40px;

package/dist/packages/uploader/uploader.scss

@@ -117,9 +117,11 @@
 
       .nut-uploader-preview-img-file-name {
         display: flex;
+        align-items: center;
         -webkit-line-clamp: 1;
         padding: 2px;
         height: 24px;
+        @include text-ellipsis();
       }
 
       .nut-progress {
@@ -200,12 +202,8 @@
             color: #1890ff !important;
           }
 
-          .nut-icon-link {
-            &::before {
-              margin-left: -45%;
-              margin-top: -45%;
-              transform: none;
-            }
+          .nut-icon-Link {
+            flex-shrink: 0;
           }
 
           @include moreline-ellipsis();