@nutui/nutui-react-taro 2.6.13 → 3.0.0-beta.0

package/dist/packages/tabs/tabs.scss

@@ -1,432 +0,0 @@
-@import '../../styles/mixins/index';
-
-.nut-tabs {
-  display: flex;
-}
-
-.nut-tabs-titles {
-  display: flex;
-  box-sizing: border-box;
-  height: $tabs-titles-height;
-  user-select: none;
-  overflow: hidden;
-  background: $tabs-titles-background-color;
-  scrollbar-width: none;
-
-  &::-webkit-scrollbar {
-    display: none;
-    width: 0;
-    background: transparent;
-  }
-
-  .nut-tabs-list {
-    width: 100%;
-    height: auto;
-    display: flex;
-    flex-shrink: 0;
-  }
-
-  &-left {
-    justify-content: flex-start;
-    .nut-tabs-titles-item {
-      padding: 0 22px;
-    }
-  }
-
-  &-right {
-    justify-content: flex-end;
-    .nut-tabs-titles-item {
-      padding: 0 22px;
-    }
-  }
-
-  &-scrollable {
-    overflow-x: auto;
-    overflow-y: hidden;
-  }
-
-  &-item {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex: 1 0 auto;
-    padding: 0 $tabs-titles-gap;
-    height: $tabs-titles-height;
-    line-height: $tabs-titles-height;
-    min-width: $tabs-titles-item-min-width;
-    font-size: $tabs-titles-font-size;
-    color: $tabs-titles-item-color;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-
-    &-left,
-    &-right {
-      flex: none;
-    }
-
-    &-text {
-      text-align: center;
-    }
-
-    &-smile,
-    &-line {
-      position: absolute;
-      transition: width 0.3s ease;
-      width: 0;
-      height: 0;
-      content: ' ';
-      bottom: $tabs-tab-line-bottom;
-      left: 50%;
-      transform: translate(-50%, 0);
-      border-radius: $tabs-tab-line-border-radius;
-      opacity: $tabs-tab-line-opacity;
-      overflow: hidden;
-    }
-
-    &-smile {
-      bottom: $tabs-titles-item-smile-bottom;
-
-      .nut-icon {
-        position: absolute;
-        font-size: 20px;
-        width: 100%;
-        height: 100%;
-        color: $color-primary;
-      }
-    }
-
-    &-active {
-      color: $tabs-titles-item-active-color;
-      font-weight: $tabs-titles-item-active-font-weight;
-
-      .nut-tabs-titles-item-line {
-        overflow: unset;
-        content: ' ';
-        width: $tabs-tab-line-width;
-        height: $tabs-tab-line-height;
-        background: $tabs-tab-line-color;
-      }
-
-      .nut-tabs-titles-item-smile {
-        overflow: unset;
-        width: 40px;
-        height: 20px;
-      }
-    }
-
-    &-disabled {
-      color: $color-text-disabled;
-    }
-  }
-
-  &-simple {
-    .nut-tabs-titles-item-active {
-      color: $color-title;
-      font-size: $tabs-titles-item-active-font-size;
-    }
-  }
-
-  &-card {
-    padding: 0;
-    background-color: $color-default-light;
-
-    .nut-tabs-titles-item {
-      padding: 0;
-
-      &-active {
-        font-weight: $font-weight-bold;
-        background-color: $white;
-        border-radius: $radius-s $radius-s 0 0;
-      }
-    }
-  }
-
-  &-button {
-    .nut-tabs-titles-item {
-      padding: 0 10px;
-      .nut-tabs-titles-item-text {
-        flex: 1;
-        height: 28px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: 0 8px;
-      }
-    }
-    .nut-tabs-titles-item-active {
-      .nut-tabs-titles-item-text {
-        background: $color-default-light;
-        color: $color-text;
-        border-radius: $tabs-tab-button-border-radius;
-        font-weight: $font-weight-bold;
-        background-color: $tabs-tab-button-active-background-color;
-        color: $color-text-link;
-        border: $tabs-tab-button-active-border;
-      }
-    }
-  }
-
-  &-divider {
-    padding: 0;
-    border-bottom: 1px solid $color-border;
-
-    .nut-tabs-titles-item {
-      padding: 0;
-      position: relative;
-
-      &::after {
-        content: '';
-        position: absolute;
-        right: 0;
-        top: 50%;
-        height: 50%;
-        width: 1px;
-        background: $color-border;
-        transform: translateY(-50%);
-      }
-
-      &:last-child {
-        &::after {
-          display: none;
-        }
-      }
-    }
-  }
-}
-
-[dir='rtl'] .nut-tabs-titles,
-.nut-rtl .nut-tabs-titles {
-  &-item {
-    &-smile,
-    &-line {
-      left: auto;
-      right: 50%;
-      transform: translate(50%, 0);
-    }
-  }
-  &-divider {
-    .nut-tabs-titles-item {
-      &::after {
-        right: auto;
-        left: 0;
-      }
-    }
-  }
-}
-
-.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;
-    height: 100%;
-    padding: 0;
-    width: $tabs-vertical-titles-width;
-    flex-shrink: 0;
-
-    .nut-tabs-list {
-      width: 100%;
-      display: flex;
-      flex-direction: column;
-      flex-shrink: 0;
-    }
-
-    &-line {
-      .nut-tabs-titles-item {
-        padding-left: 14px;
-      }
-    }
-  }
-
-  .nut-tabs-titles-scrollable {
-    overflow-x: hidden;
-    overflow-y: auto;
-  }
-
-  .nut-tabs-titles-item {
-    height: $tabs-vertical-titles-item-height;
-    margin: 0;
-    flex: none;
-
-    &-smile {
-      width: 0;
-      height: 0;
-      overflow: hidden;
-      transition: width 0.3s ease;
-    }
-
-    &-line {
-      width: 0;
-      height: 0;
-      transform: translate(0, -50%);
-      transition: height 0.3s ease;
-
-      &-vertical {
-        top: 50%;
-      }
-    }
-
-    &-active {
-      background-color: $tabs-titles-item-active-background-color;
-      .nut-tabs-titles-item-line {
-        left: 10px;
-        width: $tabs-vertical-tab-line-width;
-        height: $tabs-vertical-tab-line-height;
-        background: $tabs-vertical-tab-line-color;
-      }
-
-      .nut-tabs-titles-item-smile {
-        right: -12px;
-        bottom: -2%;
-        left: auto;
-        width: 40px;
-        height: 20px;
-        transform: rotate(320deg);
-      }
-    }
-  }
-
-  .nut-tabs-horizontal {
-    .nut-tabs-titles {
-      flex-direction: row;
-      overflow-x: auto;
-      overflow-y: hidden;
-      height: $tabs-titles-height;
-
-      .nut-tabs-list {
-        width: 100%;
-        display: flex;
-        flex-direction: row;
-        flex-shrink: 0;
-      }
-    }
-
-    .nut-tabs-content {
-      flex-direction: row;
-    }
-
-    .nut-tabs-titles-item-active {
-      background-color: initial;
-
-      .nut-tabs-titles-item-line {
-        left: 50%;
-        transform: translate(-50%, 0);
-      }
-
-      .nut-tabs-titles-item-smile {
-        left: 50%;
-        right: auto;
-        bottom: -3px;
-        transform: translate(-50%, 0) rotate(0deg);
-      }
-    }
-  }
-
-  .nut-tabs-content {
-    flex-direction: column;
-    height: 100%;
-
-    &-wrap {
-      flex: 1;
-    }
-
-    .nut-tabpane {
-      height: 100%;
-    }
-  }
-
-  .nut-tabs-horizontal {
-    .nut-tabs-titles {
-      display: flex;
-      flex-direction: row;
-      padding: 0 !important;
-      width: 100%;
-
-      .nut-tabs-titles-item {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex: 1 0 auto;
-
-        &-active {
-          color: $color-primary;
-          font-weight: $tabs-titles-item-active-font-weight;
-          font-size: $tabs-titles-item-active-font-size;
-
-          .nut-tabs-titles-item-line {
-            content: ' ';
-            width: $tabs-tab-line-width;
-            height: $tabs-tab-line-height;
-            background: $tabs-tab-line-color;
-          }
-        }
-      }
-    }
-  }
-}
-
-[dir='rtl'] .nut-tabs-vertical,
-.nut-rtl .nut-tabs-vertical {
-  .nut-tabs-titles {
-    &-line {
-      .nut-tabs-titles-item {
-        padding-left: 0;
-        padding-right: 14px;
-      }
-    }
-  }
-
-  .nut-tabs-titles-item {
-    &-active {
-      .nut-tabs-titles-item-line {
-        left: auto;
-        right: 10px;
-      }
-
-      .nut-tabs-titles-item-smile {
-        left: -12px;
-        right: auto;
-        transform: rotate(-320deg);
-      }
-    }
-  }
-
-  .nut-tabs-horizontal {
-    .nut-tabs-titles-item-active {
-      .nut-tabs-titles-item-line {
-        left: auto;
-        right: 50%;
-        transform: translate(50%, 0);
-      }
-
-      .nut-tabs-titles-item-smile {
-        right: 50%;
-        left: auto;
-        transform: translate(50%, 0) rotate(0deg);
-      }
-    }
-  }
-}
-
-.nut-tabs-content {
-  &-wrap {
-    overflow: hidden;
-  }
-
-  display: flex;
-  box-sizing: border-box;
-}

package/dist/packages/tag/tag.scss

@@ -1,79 +0,0 @@
-.nut-tag {
-  padding: $tag-padding;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  font-size: $tag-font-size;
-  border-radius: $tag-border-radius;
-  height: $tag-height;
-  color: $tag-color;
-  border: $tag-border-width solid transparent;
-
-  .nut-icon {
-    vertical-align: middle;
-    margin-left: 4px;
-  }
-
-  @mixin plain {
-    &.nut-tag-plain {
-      color: $color-title;
-      background-color: #fff;
-      border: $tag-border-width solid $color-title;
-    }
-  }
-
-  &-default {
-    background: $tag-background-color;
-    @include plain;
-  }
-
-  &-primary {
-    background: $tag-primary-background-color;
-    @include plain;
-  }
-
-  &-info {
-    background: $tag-info-background-color;
-    @include plain;
-  }
-
-  &-success {
-    background: $tag-success-background-color;
-    @include plain;
-  }
-
-  &-danger {
-    background: $tag-danger-background-color;
-    @include plain;
-  }
-
-  &-warning {
-    background: $tag-warning-background-color;
-    @include plain;
-  }
-
-  &-round {
-    border-radius: $tag-round-border-radius;
-  }
-
-  &-mark {
-    border-radius: $tag-mark-border-radius;
-  }
-
-  &-close {
-    cursor: pointer;
-  }
-
-  &-custom-icon {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-  }
-}
-[dir='rtl'] .nut-tag,
-.nut-rtl .nut-tag {
-  .nut-icon {
-    margin-left: 0;
-    margin-right: 4px;
-  }
-}

package/dist/packages/textarea/textarea.scss

@@ -1,65 +0,0 @@
-.nut-textarea {
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-  display: flex;
-  background: $color-background-overlay;
-  font-size: $textarea-font;
-  padding: $textarea-padding;
-
-  &-disabled {
-    .nut-textarea-textarea,
-    .nut-textarea-limit {
-      cursor: not-allowed;
-      color: $textarea-disabled-color !important;
-    }
-  }
-
-  &-limit {
-    position: absolute;
-    right: 15px;
-    bottom: 12px;
-    font-size: $textarea-font;
-    color: $textarea-limit-color;
-  }
-
-  &-textarea {
-    outline: none;
-    display: block;
-    box-sizing: border-box;
-    width: 100%;
-    min-width: 0;
-    margin: 0;
-    padding: 0;
-    font-size: $textarea-font;
-    color: $textarea-text-color;
-    caret-color: $textarea-text-curror-color;
-    text-align: start;
-    background-color: transparent;
-    border: 0;
-    resize: none;
-
-    .taro-textarea {
-      background-color: transparent;
-      resize: none;
-    }
-  }
-
-  .cpoyText {
-    position: absolute;
-    top: -999999px;
-    left: -999999px;
-  }
-}
-
-[dir='rtl'] .nut-textarea,
-.nut-rtl .nut-textarea {
-  &-limit {
-    right: auto;
-    left: 15px;
-  }
-  .cpoyText {
-    left: auto;
-    right: -999999px;
-  }
-}

package/dist/packages/timeselect/timeselect.scss

@@ -1,35 +0,0 @@
-
-.nut-timeselect {
-  background-color: $color-background-overlay;
-  display: flex;
-  flex-direction: column;
-  height: calc(100% - 50px);
-
-  &-content {
-    display: flex;
-    flex: 1;
-  }
-
-  &-content-left {
-    width: $timeselect-date-width;
-    min-width: $timeselect-date-width;
-    height: 100%;
-    overflow: auto;
-    background: $color-background-sunken;
-  }
-}
-
-.nut-timepannel {
-  padding: 0 16px;
-  height: $timeselect-date-height;
-  line-height: $timeselect-date-height;
-  text-align: start;
-  color: $color-text;
-  font-size: $font-size-base;
-
-  &.active {
-    background: $color-background-overlay;
-    color: $timeselect-date-active-color;
-    font-weight: $font-weight-bold;
-  }
-}