@nutui/nutui-react 1.5.1 → 1.5.2-beta.0

package/dist/packages/table/table.scss

@@ -1,152 +0,0 @@
-
-.nut-theme-dark {
-  .nut-table {
-    margin-bottom: 3px;
-
-    &__main {
-      color: $dark1;
-      background-color: $dark5;
-
-      &--striped {
-        .nut-table__main__head {
-          &__tr {
-            background-color: $dark6;
-          }
-        }
-
-        .nut-table__main__body {
-          &__tr:nth-child(odd) {
-            background-color: $dark4;
-          }
-        }
-
-        .nut-table__main__body {
-          &__tr:nth-child(even) {
-            background-color: $dark6;
-          }
-        }
-      }
-    }
-
-    .nut-table__nodata {
-      background-color: $dark6;
-
-      .nut-table__nodata {
-        color: $dark1;
-      }
-    }
-
-    &__summary {
-      color: $dark1;
-      background-color: $dark4;
-    }
-
-    &__nodata {
-      color: $dark1;
-      background-color: $dark4;
-    }
-  }
-}
-
-.nut-table {
-  display: flex;
-  width: 100%;
-  flex-direction: column;
-  font-size: $font-size-2;
-  color: $title-color;
-
-  &__main {
-    display: table;
-    width: 100%;
-    border-collapse: collapse;
-    overflow-x: hidden;
-    color: $title-color;
-    background-color: $background-color3;
-
-    &--striped {
-      .nut-table__main__head {
-        &__tr {
-          background-color: $table-tr-even-bg-color;
-        }
-      }
-
-      .nut-table__main__body {
-        &__tr:nth-child(odd) {
-          background-color: $table-tr-odd-bg-color;
-        }
-      }
-
-      .nut-table__main__body {
-        &__tr:nth-child(even) {
-          background-color: $table-tr-even-bg-color;
-        }
-      }
-    }
-
-    &__head,
-    &__body {
-      &__tr {
-        display: table-row;
-
-        &__th {
-          display: table-cell;
-          padding: $table-cols-padding;
-        }
-
-        &__td {
-          display: table-cell;
-          padding: $table-cols-padding;
-
-          &__nodata {
-            display: flex;
-            height: 50px;
-            align-items: center;
-            justify-content: center;
-          }
-        }
-
-        &--border {
-          border: 1px solid $table-border-color;
-        }
-
-        &--alignleft,
-        &--align {
-          text-align: left;
-        }
-
-        &--aligncenter {
-          text-align: center;
-        }
-
-        &--alignright {
-          text-align: right;
-        }
-      }
-    }
-
-    &__head {
-      display: table-header-group;
-    }
-
-    &__body {
-      display: table-row-group;
-    }
-  }
-
-  &__summary {
-    display: flex;
-    align-items: center;
-    height: 30px;
-    padding: $table-cols-padding;
-  }
-
-  &__nodata {
-    color: $title-color;
-    background-color: $background-color3;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 30px;
-    padding: $table-cols-padding;
-  }
-}

package/dist/packages/tabpane/tabpane.scss

@@ -1,23 +0,0 @@
-.nut-theme-dark {
-  .nut-tabpane {
-    background: $dark4;
-  }
-}
-.nut-tabpane {
-  width: 100%;
-  flex-shrink: 0;
-  display: block;
-  background-color: $gray6;
-  color: $gray1;
-  padding: 24px 20px;
-  box-sizing: border-box;
-  overflow: auto;
-  &.active {
-    // overflow: visible;
-  }
-
-  &.inactive {
-    overflow: visible;
-    height: 0;
-  }
-}

package/dist/packages/tabs/tabs.scss

@@ -1,284 +0,0 @@
-@import '../../styles/mixins/index';
-
-.nut-theme-dark {
-  .nut-tabs {
-    .nut-tabpane {
-      color: $white;
-    }
-
-    &__titles {
-      background: $dark5;
-
-      &-item {
-        color: $dark1;
-
-        &.active {
-          color: $dark1;
-        }
-
-        &__text {
-          color: $dark1;
-        }
-      }
-    }
-
-    &.vertical {
-      .nut-tabs__titles {
-        &-item {
-          &.active {
-            background-color: $dark5;
-          }
-        }
-      }
-    }
-  }
-}
-
-.nut-tabs {
-  display: flex;
-
-  &.horizontal {
-    flex-direction: column;
-  }
-
-  &.vertical {
-    flex-direction: row;
-    width: 100%;
-
-    .nut-tabs__titles {
-      box-sizing: border-box;
-      flex-direction: column;
-      height: 100%;
-      padding: 0 !important;
-      width: $tabs-vertical-titles-width;
-      flex-shrink: 0;
-
-      &.scrollable {
-        overflow-x: hidden;
-        overflow-y: auto;
-      }
-
-      .nut-tabs__titles-item {
-        height: $tabs-vertical-titles-item-height;
-        flex: none;
-
-        .nut-tabs__titles-item__smile {
-          transition: width 0.3s ease;
-        }
-
-        .nut-tabs__titles-item__line {
-          bottom: none;
-          transform: translate(0, -50%);
-          transition: height 0.3s ease;
-          width: 0;
-          height: 0;
-        }
-
-        &.active {
-          background-color: $tabs-horizontal-titles-item-active-background-color;
-
-          .nut-tabs__titles-item__line {
-            left: 10px;
-            width: $tabs-vertical-titles-item-active-line-width;
-            height: $tabs-vertical-titles-item-active-line-height;
-            background: $tabs-vertical-tab-line-color;
-          }
-
-          .nut-tabs__titles-item__smile {
-            right: -2px;
-            bottom: 2px;
-            left: auto;
-            width: 3px;
-            transform: rotate(320deg);
-            height: $tabs-vertical-titles-item-active-line-height;
-          }
-        }
-      }
-    }
-
-    .nut-tabs__content {
-      flex-direction: column;
-
-      &__wrap {
-        flex: 1;
-      }
-
-      height: 100%;
-
-      .nut-tabpane {
-        height: 100%;
-      }
-    }
-
-    .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;
-
-          .nut-tabs__titles-item__smile,
-          .nut-tabs__titles-item__line {
-            position: absolute;
-            transition: width 0.3s ease;
-            width: 0;
-            height: 0;
-            content: ' ';
-            bottom: $tabs-horizontal-tab-line-bottom;
-            left: 50%;
-            transform: translate(-50%, 0);
-            overflow: hidden;
-            border-radius: $tabs-horizontal-tab-line-border-radius;
-            opacity: $tabs-horizontal-tab-line-opacity;
-          }
-
-          &.active {
-            color: $tabs-titles-item-active-color;
-            font-weight: $tabs-titles-item-active-font-weight;
-
-            .nut-tabs__titles-item__line {
-              content: ' ';
-              width: $tabs-horizontal-titles-item-active-line-width;
-              height: $tabs-horizontal-titles-item-active-line-height;
-              background: $tabs-horizontal-tab-line-color;
-            }
-          }
-        }
-      }
-    }
-  }
-
-  .nut-tabs__titles {
-    height: $tabs-horizontal-titles-height;
-    padding: 0 10px;
-    display: flex;
-    user-select: none;
-    background: $tabs-titles-background-color;
-    border-radius: $tabs-titles-border-radius;
-    flex-shrink: 0;
-    overflow: hidden;
-
-    &.large {
-      .nut-tabs__titles-item {
-        font-size: $tabs-titles-item-large-font-size;
-      }
-    }
-
-    &.normal {
-      .nut-tabs__titles-item {
-        font-size: $tabs-titles-item-font-size;
-      }
-    }
-
-    &.small {
-      .nut-tabs__titles-item {
-        font-size: $tabs-titles-item-small-font-size;
-      }
-    }
-
-    &::-webkit-scrollbar {
-      display: none;
-      width: 0;
-      background: transparent;
-    }
-
-    &.smile {
-      .nut-tabs__titles-item {
-        &.active {
-          .nut-tabs__titles-item__smile {
-            width: 20px;
-            height: 8px;
-          }
-        }
-      }
-    }
-
-    &.scrollable {
-      overflow-x: auto;
-      overflow-y: hidden;
-
-      .nut-tabs__titles-item {
-        width: auto;
-      }
-    }
-
-    .nut-tabs__titles-item {
-      position: relative;
-      font-size: $tabs-titles-item-font-size;
-      min-width: $tabs-horizontal-titles-item-min-width;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      flex: 1 0 auto;
-      color: $tabs-titles-item-color;
-
-      .nut-tabs__titles-item__text {
-        text-align: center;
-
-        &.ellipsis {
-          @include oneline-ellipsis();
-        }
-      }
-
-      .nut-tabs__titles-item__smile,
-      .nut-tabs__titles-item__line {
-        position: absolute;
-        transition: width 0.3s ease;
-        width: 0;
-        height: 0;
-        content: ' ';
-        bottom: $tabs-horizontal-tab-line-bottom;
-        left: 50%;
-        transform: translate(-50%, 0);
-        overflow: hidden;
-        border-radius: $tabs-horizontal-tab-line-border-radius;
-        opacity: $tabs-horizontal-tab-line-opacity;
-      }
-
-      .nut-tabs__titles-item__smile {
-        .nut-icon {
-          position: absolute;
-          font-size: 12px;
-          width: 100%;
-          height: 100%;
-          color: $tabs-tab-smile-color;
-        }
-      }
-
-      &.nut-tabs__titles-item-left-align {
-        flex: none;
-      }
-
-      &.disabled {
-        color: $disable-color;
-      }
-
-      &.active {
-        color: $tabs-titles-item-active-color;
-        font-weight: $tabs-titles-item-active-font-weight;
-
-        .nut-tabs__titles-item__line {
-          content: ' ';
-          width: $tabs-horizontal-titles-item-active-line-width;
-          height: $tabs-horizontal-titles-item-active-line-height;
-          background: $tabs-horizontal-tab-line-color;
-        }
-      }
-    }
-  }
-
-  &__content {
-    &__wrap {
-      overflow: hidden;
-    }
-
-    display: flex;
-    box-sizing: border-box;
-  }
-}

package/dist/packages/tag/tag.scss

@@ -1,67 +0,0 @@
-
-.nut-tag {
-  padding: $tag-padding;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  font-size: $tag-font-size;
-  border-radius: $tag-default-border-radius;
-  height: $tag-height;
-
-  ._icon {
-    vertical-align: middle;
-    margin-left: 4px;
-  }
-
-  @mixin plain {
-    &.nut-tag--plain {
-      color: $tag-default-background-color;
-      border: $tag-border-width solid $tag-default-background-color;
-    }
-  }
-
-  &--default {
-    color: $tag-default-color;
-    background: $tag-default-background-color;
-    border: $tag-border-width solid transparent;
-    @include plain;
-  }
-
-  &--primary {
-    color: $tag-default-color;
-    background: $tag-primary-background-color;
-    border: $tag-border-width solid transparent;
-    @include plain;
-  }
-
-  &--success {
-    color: $tag-default-color;
-    background: $tag-success-background-color;
-    border: $tag-border-width solid transparent;
-    @include plain;
-  }
-
-  &--danger {
-    color: $tag-default-color;
-    background: $tag-danger-background-color;
-    border: $tag-border-width solid transparent;
-    @include plain;
-  }
-
-  &--warning {
-    color: $tag-default-color;
-    background: $tag-warning-background-color;
-    border: $tag-border-width solid transparent;
-    @include plain;
-  }
-  &--round {
-    border-radius: 8px;
-  }
-  &--mark {
-    border-radius: 0 12px 12px 0;
-  }
-  &--close {
-    margin-left: 4px;
-    cursor: pointer;
-  }
-}

package/dist/packages/textarea/textarea.scss

@@ -1,60 +0,0 @@
-.nut-theme-dark {
-  .nut-textarea {
-    background: $dark5;
-
-    &__textarea {
-      color: $dark1;
-    }
-  }
-}
-
-.nut-textarea {
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-  display: flex;
-  background: $white;
-  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 {
-    // min-height: $textarea-height;
-    outline: none;
-    display: block;
-    box-sizing: border-box;
-    width: 100%;
-    min-width: 0;
-    margin: 0;
-    padding: 0;
-    font-size: $textarea-font;
-    line-height: $textarea-text-line-height;
-    color: $textarea-text-color;
-    caret-color: $textarea-text-curror-color;
-    text-align: left;
-    background-color: transparent;
-    border: 0;
-    resize: none;
-  }
-
-  .cpoyText {
-    position: absolute;
-    top: -999999px;
-    left: -999999px;
-  }
-}

package/dist/packages/timedetail/timedetail.scss

@@ -1,45 +0,0 @@
-.nut-theme-dark {
-  .nut-timedetail {
-    background-color: $dark6;
-    &__detail {
-      &__list {
-        &__item {
-          background-color: $dark4;
-          color: $dark1;
-          &--curr {
-            color: $timeselect-timedetail-item-cur-text-color;
-          }
-        }
-      }
-    }
-  }
-}
-.nut-timedetail {
-  display: flex;
-  align-content: flex-start;
-  flex-wrap: wrap;
-  padding: 0 0 50px 13px;
-
-  &__item {
-    width: 100px;
-    height: 50px;
-    line-height: 50px;
-    text-align: center;
-    margin-right: 10px;
-    margin-bottom: 10px;
-    background-color: $background-color;
-    color: $title-color;
-    &-active {
-      background-color: $dark-brand-color;
-    }
-    border-radius: 5px;
-    font-size: 14px;
-    border: 1px solid transparent;
-    font-weight: 700;
-  }
-  &__item-active {
-    background-color: #fa2c1926;
-    border: 1px solid #fa2c19;
-    color: #fa2c19;
-  }
-}

package/dist/packages/timepannel/timepannel.scss

@@ -1,17 +0,0 @@
-.nut-theme-dark {
-  .nut-timepannel {
-    background-color: $dark5;
-    color: $dark2;
-    &--curr {
-      background-color: $dark5;
-      color: $dark1;
-    }
-  }
-}
-.nut-timepannel {
-  height: $timeselect-timepannel-height;
-  line-height: 40px;
-  text-align: center;
-  color: $timeselect-timepannel-text-color;
-  font-size: $timeselect-timepannel-font-size;
-}

package/dist/packages/timeselect/timeselect.scss

@@ -1,73 +0,0 @@
-
-.nut-theme-dark {
-  .nut-timeselect {
-    background-color: $dark6;
-
-    &__title {
-      background-color: $dark6;
-      color: $dark1;
-    }
-
-    &__content {
-      &-left {
-        background-color: $dark5;
-        color: $dark1;
-
-        .nut-timepannel-active {
-          background-color: $dark6;
-          color: $dark1;
-        }
-      }
-    }
-  }
-
-  .nut-timedetail__item {
-    background-color: $dark4;
-    color: $dark1;
-
-    &-active {
-      background-color: $dark-brand-color;
-    }
-  }
-}
-
-.nut-timeselect {
-  background-color: $background-color3;
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-
-  &__title {
-    height: $timeselect-title-height;
-    line-height: $timeselect-title-line-height;
-    margin-bottom: 10px;
-    font-size: $timeselect-title-font-size;
-    background-color: $background-color3;
-    color: $title-color;
-    text-align: center;
-  }
-
-  &__content {
-    display: flex;
-    flex: 1;
-  }
-
-  &__content-left {
-    width: 140px;
-    min-width: 140px;
-    height: 100%;
-    overflow: auto;
-    background-color: $background-color2;
-    color: $title-color;
-
-    .nut-timepannel-active {
-      background-color: red;
-    }
-  }
-
-  .nut-timepannel-active {
-    background-color: $background-color3;
-    color: $title-color;
-    font-weight: 700;
-  }
-}