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

package/dist/packages/navbar/navbar.scss

@@ -1,185 +0,0 @@
-
-.nut-theme-dark {
-  .nut-navbar {
-    background: $dark5;
-    color: $dark1;
-    box-shadow: none;
-
-    .title {
-      color: $dark1;
-    }
-
-    &__left {
-      color: $dark2;
-
-      i {
-        color: $dark2 !important;
-      }
-    }
-
-    &__right {
-      color: $dark1;
-    }
-
-    &--border {
-      border-bottom: none;
-    }
-  }
-
-  .nut-tabs__titles-item__text {
-    background: $dark5;
-    color: $dark1;
-  }
-}
-
-.nut-navbar {
-  width: $navbar-width;
-  position: relative;
-  display: flex;
-  align-items: center;
-  height: $navbar-height;
-  box-sizing: border-box;
-  padding: $navbar-padding;
-  background: $navbar-background;
-  box-shadow: $navbar-box-shadow;
-  font-size: $navbar-title-base-font;
-  color: $navbar-color;
-  margin-bottom: $navbar-margin-bottom;
-  overflow: hidden;
-
-  &:active::before {
-    opacity: 0.1;
-  }
-
-  &--border {
-    border-bottom: 1px solid #eee;
-  }
-
-  &--fixed {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-  }
-
-  &--placeholder {
-    display: inline-block;
-    width: 100%;
-  }
-
-  &--safe-area-inset-top {
-    padding-top: constant(safe-area-inset-top);
-    padding-top: env(safe-area-inset-top);
-  }
-
-  &--clickable {
-    &::before {
-      position: absolute;
-      content: ' ';
-      top: 50%;
-      left: 50%;
-      width: 100%;
-      height: 100%;
-      background-color: $black;
-      border: inherit;
-      border-color: $black;
-      border-radius: inherit;
-      transform: translate(-50%, -50%);
-      opacity: 0;
-    }
-  }
-
-  .nutui-iconfont {
-    .nut-icon-left {
-      text-align: left;
-    }
-  }
-
-  &__title {
-    min-width: 53%;
-    margin: 0 auto;
-    text-align: center;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    .title {
-      min-width: $navbar-title-width;
-      font-size: $navbar-title-font;
-      font-weight: $navbar-title-font-weight;
-      color: $navbar-title-font-color;
-      display: -webkit-box;
-      -webkit-box-orient: vertical;
-      -webkit-line-clamp: 1;
-      overflow: hidden;
-    }
-
-    &.icon {
-      .icon {
-        margin: $navbar-title-icon-margin;
-      }
-    }
-
-    .nut-icon {
-      display: inline;
-    }
-
-    &-desc {
-      font-size: $cell-title-desc-font;
-    }
-
-    .text__title {
-      display: inline-block;
-    }
-
-    .nut-tabs__titles {
-      background: $white;
-
-      &-item__text {
-        color: $title-color;
-      }
-    }
-
-    .nut-tabpane {
-      display: none;
-    }
-  }
-
-  &__title ::-webkit-scrollbar {
-    display: none;
-  }
-
-  &__left {
-    font-size: $cell-desc-font;
-    color: $gray2;
-    position: absolute;
-    left: 0;
-    top: 0;
-    bottom: 0;
-    display: flex;
-    align-items: center;
-    cursor: pointer;
-    padding: 0 16px;
-  }
-
-  &__right {
-    font-size: $cell-desc-font;
-    color: $gray2;
-    position: absolute;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    display: flex;
-    align-items: center;
-    padding: 0 16px;
-    cursor: pointer;
-
-    .rightIcon {
-      margin-left: 16px;
-    }
-
-    .leftIcon {
-      margin-left: 16px;
-    }
-  }
-}

package/dist/packages/noticebar/noticebar.scss

@@ -1,156 +0,0 @@
-.nut-theme-dark {
-  .nut-noticebar {
-    .wrap {
-      .content {
-        a {
-          color: $noticebar-color;
-        }
-      }
-    }
-    .nut-noticebar-vertical {
-      .horseLamp_list {
-        .custom-item {
-          color: $noticebar-color;
-        }
-      }
-    }
-  }
-}
-.nut-noticebar {
-  width: 100%;
-  .nut-noticebar-page {
-    display: flex;
-    padding: $noticebar-box-padding;
-    height: $noticebar-height;
-    font-size: $noticebar-font-size;
-    position: relative;
-    align-items: center;
-    background: $noticebar-background;
-    color: $noticebar-color;
-    &.wrapable {
-      height: auto;
-      padding: $noticebar-wrapable-padding;
-      .wrap {
-        height: auto;
-        .content {
-          position: relative;
-          white-space: normal;
-          word-wrap: break-word;
-        }
-      }
-    }
-
-    .withicon {
-      position: relative;
-      padding-right: 40px;
-    }
-    .left-icon {
-      height: $noticebar-left-icon-width;
-      min-width: $noticebar-left-icon-width;
-      margin: $noticebar-lefticon-margin;
-      background-size: 100% 100%;
-    }
-    .right-icon {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      width: $noticebar-right-icon-width;
-      margin: $noticebar-righticon-margin;
-    }
-    .wrap {
-      display: flex;
-      flex: 1;
-      height: $noticebar-line-height;
-      line-height: $noticebar-line-height;
-      overflow: hidden;
-      position: relative;
-    }
-    .content {
-      position: absolute;
-      white-space: nowrap;
-      &.nut-ellipsis {
-        max-width: 100%;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-    }
-    // 只跑一次
-    .play {
-      animation: nut-notice-bar-play linear both running;
-    }
-    .play-infinite {
-      animation: nut-notice-bar-play-infinite linear infinite both running;
-    }
-    .play-vertical {
-      animation: nut-notice-bar-play-vertical linear infinite both running;
-    }
-  }
-
-  @keyframes nut-notice-bar-play {
-    to {
-      transform: translate3d(-100%, 0, 0);
-    }
-  }
-
-  @keyframes nut-notice-bar-play-infinite {
-    to {
-      transform: translate3d(-100%, 0, 0);
-    }
-  }
-  // 垂直方向的滚动
-  @keyframes nut-notice-bar-play-vertical {
-    to {
-      transform: translateY($noticebar-height);
-    }
-  }
-
-  // 纵向
-  .nut-noticebar-vertical {
-    position: relative;
-    display: flex;
-    justify-content: space-between;
-    height: $noticebar-height;
-    font-size: $noticebar-font-size;
-    overflow: hidden;
-    padding: $noticebar-box-padding;
-    background: $noticebar-background;
-    color: $noticebar-color;
-    .left-icon {
-      height: $noticebar-left-icon-width;
-      min-width: $noticebar-left-icon-width;
-      margin: $noticebar-lefticon-margin;
-      background-size: 100% 100%;
-      display: flex;
-      align-self: center;
-    }
-    .horseLamp_list {
-      margin: 0;
-      padding: 0;
-      display: block;
-      flex: 1;
-      .horseLamp_list_item {
-        display: flex;
-        align-items: center;
-        height: $noticebar-height;
-        width: 100%;
-      }
-    }
-    .nut-noticebar__inner {
-      display: flex;
-      height: 100%;
-      width: 100%;
-      -webkit-box-orient: vertical;
-      -webkit-box-direction: normal;
-      flex-direction: column;
-    }
-
-    .go {
-      align-self: center;
-      display: flex;
-      justify-content: center;
-      width: $noticebar-right-icon-width;
-      margin: $noticebar-righticon-margin;
-    }
-  }
-}

package/dist/packages/notify/notify.scss

@@ -1,93 +0,0 @@
-/*入场动画开始*/
-.fade-enter {
-  opacity: 0;
-}
-
-/*入场动画过程*/
-.fade-enter-active {
-  opacity: 1;
-  transition: opacity 1s;
-}
-
-/*入场动画结束*/
-.fade-enter-done {
-  opacity: 1;
-}
-
-/*离场动画开始*/
-.fade-exit {
-  opacity: 1;
-}
-
-/*离场动画过程*/
-.fade-exit-active {
-  opacity: 0;
-  transition: opacity 1s;
-}
-
-/*离场动画结束*/
-.fade-exit-done {
-  opacity: 0;
-}
-
-/*页面第一次加载时的开始状态*/
-.fade-appear {
-  opacity: 0;
-}
-
-/*页面第一次加载时的动画过程*/
-.fade-appear-active {
-  opacity: 1;
-  transition: opacity 1s;
-}
-
-.nut-notify {
-  box-sizing: border-box;
-  padding: $notify-padding;
-  color: $notify-text-color;
-  font-size: $notify-font-size;
-  white-space: pre-wrap;
-  text-align: center;
-  word-wrap: break-word;
-  height: $notify-height;
-
-  &--popup-top {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    overflow-y: auto;
-    transition: transform 0.3s;
-    z-index: 9999;
-  }
-
-  &--popup-bottom {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    overflow-y: auto;
-    transition: transform 0.3s;
-    z-index: 9999;
-  }
-
-  &--base {
-    background: $notify-base-background-color;
-  }
-
-  &--primary {
-    background: $notify-primary-background-color;
-  }
-
-  &--success {
-    background: $notify-success-background-color;
-  }
-
-  &--danger {
-    background: $notify-danger-background-color;
-  }
-
-  &--warning {
-    background: $notify-warning-background-color;
-  }
-}

package/dist/packages/numberkeyboard/numberkeyboard.scss

@@ -1,147 +0,0 @@
-
-.nut-theme-dark {
-  .nut-numberkeyboard {
-    background-color: $dark5;
-
-    &__body {
-      background-color: $dark5;
-      color: $dark1;
-
-      .nut-numberkeyboard__body__keys,
-      .nut-numberkeyboard__sidebar {
-        .key-board-wrapper {
-          background-color: $dark5;
-
-          .key {
-            background-color: $dark4;
-            color: $dark1;
-          }
-        }
-      }
-    }
-
-    .nut-numberkeyboard__header {
-      .nut-numberkeyboard__header__tit {
-        color: $dark1;
-      }
-    }
-
-    &__header {
-      &__close {
-        color: $dark1 !important;
-      }
-    }
-  }
-}
-
-.nut-numberkeyboard {
-  width: $numberkeyboard-width;
-  padding: $numberkeyboard-padding;
-  background-color: $numberkeyboard-background-color;
-  user-select: none;
-  background-color: $gray4;
-
-  .nut-numberkeyboard__header {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    box-sizing: content-box;
-    height: $numberkeyboard-header-height;
-    padding: $numberkeyboard-header-padding;
-    color: $numberkeyboard-header-color;
-    font-size: $numberkeyboard-header-font-size;
-
-    .nut-numberkeyboard__header__tit {
-      color: $title-color;
-      display: inline-block;
-    }
-
-    .nut-numberkeyboard__header__close {
-      position: absolute;
-      display: block;
-      right: 0;
-      padding: $numberkeyboard-header-close-padding;
-      color: $numberkeyboard-header-close-color;
-      font-size: $numberkeyboard-header-close-font-size;
-      background-color: $numberkeyboard-header-close-background-color;
-      border: none;
-      cursor: pointer;
-    }
-  }
-
-  .nut-numberkeyboard__body {
-    display: flex;
-    padding: 6px 0 0 6px;
-
-    .nut-numberkeyboard__body__keys {
-      display: flex;
-      flex: 3;
-      flex-wrap: wrap;
-    }
-
-    .key-board-wrapper {
-      position: relative;
-      flex: 1;
-      flex-basis: 33%;
-      box-sizing: border-box;
-      padding: 0 6px 6px 0;
-      background-color: $gray5;
-
-      .key {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        height: $numberkeyboard-key-height;
-        font-size: $numberkeyboard-key-font-size;
-        line-height: $numberkeyboard-key-line-height;
-        background-color: $numberkeyboard-key-background-color;
-        color: $numberkeyboard-key-font-color;
-        border-radius: $numberkeyboard-key-border-radius;
-        cursor: pointer;
-      }
-
-      .active {
-        background-color: $numberkeyboard-key-active-background-color;
-      }
-
-      img {
-        width: 30px;
-        height: 24px;
-      }
-    }
-
-    .key-board-wrapper-large {
-      flex-basis: 66%;
-    }
-
-    .nut-numberkeyboard__sidebar {
-      display: flex;
-      flex: 1;
-      flex-direction: column;
-
-      .key-board-wrapper {
-        .key {
-          position: absolute;
-          top: 0;
-          right: 6px;
-          bottom: 6px;
-          left: 0;
-          height: auto;
-        }
-
-        .finish {
-          font-size: $numberkeyboard-key-finish-font-size;
-          color: $numberkeyboard-key-finish-font-color;
-          background-color: $numberkeyboard-key-finish-background-color;
-        }
-
-        .activeFinsh {
-          font-size: $numberkeyboard-key-finish-font-size;
-          color: $numberkeyboard-key-finish-font-color;
-          background-color: $numberkeyboard-key-activeFinsh-background-color;
-        }
-      }
-    }
-  }
-}

package/dist/packages/overlay/overlay.scss

@@ -1,75 +0,0 @@
-.nut-theme-dark {
-  .nut-overlay {
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background: $dark7;
-  }
-  .overlay-fade-enter-active {
-    .wrapper {
-      .content {
-        background-color: $dark2;
-        color: $white;
-      }
-    }
-  }
-}
-
-.nut-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  background: $overlay-bg-color;
-}
-.nut-overflow-hidden {
-  overflow: hidden !important;
-}
-.overlay-fade-enter-active {
-  animation: nut-fade-in;
-  .wrapper {
-    .content {
-      background-color: $overlay-content-bg-color;
-      color: $overlay-content-color;
-    }
-  }
-}
-.overlay-fade-leave-active {
-  animation: nut-fade-out;
-}
-.first-render {
-  display: none;
-}
-.hidden-render {
-  display: none;
-}
-@keyframes nut-fade-in {
-  0% {
-    opacity: 0;
-  }
-
-  1% {
-    opacity: 0;
-  }
-
-  100% {
-    opacity: 1;
-  }
-}
-
-@keyframes nut-fade-out {
-  0% {
-    opacity: 1;
-  }
-
-  1% {
-    opacity: 1;
-  }
-
-  100% {
-    opacity: 0;
-  }
-}

package/dist/packages/pagination/pagination.scss

@@ -1,81 +0,0 @@
-.nut-theme-dark {
-  .nut-pagination {
-    &__prev,
-    &__item,
-    &__next {
-      background: $dark5;
-      border: 1px solid $dark5;
-    }
-    &-simple {
-      background: $dark4;
-    }
-    .simple-border {
-      border-color: $dark2;
-    }
-    .disabled {
-      background-color: $dark2;
-      color: $disable-color;
-      border: 1px solid $dark2;
-    }
-    &.active {
-      background: $dark-pagination-active-background-color;
-    }
-    &__contain {
-      .nut-pagination__item {
-        background-color: $dark5;
-        border: 1px solid $dark4;
-      }
-    }
-  }
-}
-.nut-pagination {
-  display: flex;
-  font-size: $pagination-font-size;
-  color: $pagination-color;
-  &__contain {
-    display: flex;
-  }
-  &__simple {
-    height: 39px;
-    width: 124px;
-    line-height: 39px;
-    text-align: center;
-  }
-  &__prev,
-  &__item,
-  &__next {
-    height: 39px;
-    min-width: 39px;
-    flex-shrink: 0;
-    box-sizing: border-box;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background: $white;
-    border-radius: $pagination-item-border-radius;
-    border: $pagination-item-border-width solid $pagination-item-border-color;
-    cursor: pointer;
-  }
-  &__prev,
-  &__item {
-    border-right: none;
-  }
-  &__prev,
-  &__next {
-    padding: $pagination-prev-next-padding;
-  }
-  .simple-border {
-    border-right: $pagination-item-border-width solid
-      $pagination-item-border-color;
-  }
-  .active {
-    color: $white;
-    border: none;
-    background: $pagination-active-background-color;
-  }
-  .disabled {
-    color: $pagination-disable-color;
-    background-color: $pagination-disable-background-color;
-    cursor: not-allowed;
-  }
-}