@sdata/web-vue 1.5.0 → 1.7.0

package/es/upload/style/index.less

@@ -1,500 +0,0 @@
-@import url('./token.less');
-
-@upload-prefix-cls: ~'@{prefix}-upload';
-
-.@{upload-prefix-cls} {
-  display: inline-block;
-  max-width: 100%;
-  cursor: pointer;
-
-  &&-draggable {
-    width: 100%;
-  }
-
-  &-tip {
-    margin-top: @upload-tip-margin-top;
-    overflow: hidden;
-    color: @upload-tip-color-text;
-    font-size: @upload-tip-font-size;
-    line-height: 1.5;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  }
-
-  &-picture-card {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    min-width: @upload-picture-item-width;
-    height: @upload-picture-item-width;
-    margin-bottom: 0;
-    color: @upload-picture-color-text;
-    text-align: center;
-    background: @upload-picture-color-bg;
-    border: @upload-picture-border-width @upload-picture-border-style @upload-picture-color-border;
-    border-radius: @upload-picture-border-radius;
-    transition: all @transition-duration-1 @transition-timing-function-linear;
-
-    &:hover {
-      color: @upload-picture-color-text_hover;
-      background-color: @upload-picture-color-bg_hover;
-      border-color: @upload-picture-color-border_hover;
-    }
-  }
-
-  &-drag {
-    width: 100%;
-    padding: @upload-drag-padding-vertical 0;
-    color: @upload-drag-color-text;
-    text-align: center;
-    background-color: @upload-drag-color-bg;
-    border: @upload-drag-border-width @upload-drag-border-style @upload-drag-color-border;
-    border-radius: @upload-drag-border-radius;
-    transition: all @transition-duration-2 ease;
-
-    .@{prefix}-icon-plus {
-      margin-bottom: @upload-drag-margin-icon-bottom;
-      color: @upload-drag-color-icon;
-      font-size: @upload-drag-size-icon;
-    }
-
-    &:hover {
-      background-color: @upload-drag-color-bg_hover;
-      border-color: @upload-drag-color-border_hover;
-
-      .@{upload-prefix-cls}-drag-text {
-        color: @upload-drag-color-text_hover;
-      }
-
-      .@{prefix}-icon-plus {
-        color: @upload-drag-color-icon_hover;
-      }
-    }
-
-    &-active {
-      color: @upload-drag-color-text_active;
-      background-color: @upload-drag-color-bg_active;
-      border-color: @upload-drag-color-border_active;
-
-      .@{upload-prefix-cls}-drag-text {
-        color: @upload-drag-color-text_active;
-      }
-
-      .@{prefix}-icon-plus {
-        color: @upload-drag-color-icon_active;
-      }
-    }
-
-    .@{upload-prefix-cls}-tip {
-      margin-top: @upload-drag-tip-margin-top;
-    }
-  }
-
-  &-drag-text {
-    color: @upload-drag-color-text;
-    font-size: @upload-drag-font-size;
-    line-height: 1.5;
-  }
-
-  &-wrapper {
-    width: 100%;
-
-    &&-type-picture-card {
-      display: flex;
-      justify-content: flex-start;
-    }
-  }
-
-  &-drag {
-    width: 100%;
-  }
-
-  &-hide {
-    display: none;
-  }
-
-  &-disabled {
-    .@{upload-prefix-cls}-picture-card,
-    .@{upload-prefix-cls}-picture-card:hover {
-      color: @upload-picture-color-text_disabled;
-      background-color: @upload-picture-color-bg_disabled;
-      border-color: @upload-picture-color-border_disabled;
-      cursor: not-allowed;
-    }
-
-    .@{upload-prefix-cls}-drag,
-    .@{upload-prefix-cls}-drag:hover {
-      background-color: @upload-drag-color-bg_disabled;
-      border-color: @upload-drag-color-border_disabled;
-      cursor: not-allowed;
-
-      .@{prefix}-icon-plus,
-      .@{upload-prefix-cls}-drag-text {
-        color: @upload-drag-color-text_disabled;
-      }
-    }
-
-    .@{upload-prefix-cls}-tip {
-      color: @upload-drag-color-text_disabled;
-    }
-  }
-}
-
-.@{upload-prefix-cls}-icon {
-  cursor: pointer;
-
-  &-error {
-    margin-left: @upload-text-item-margin-error-icon-left;
-    color: @upload-text-item-color-error-icon;
-  }
-
-  &-success {
-    color: @upload-text-item-color-success-icon;
-    font-size: @upload-text-item-size-success-icon;
-    line-height: @upload-text-item-size-success-icon;
-  }
-
-  &-remove {
-    position: relative;
-    font-size: @upload-picture-item-size-operation-icon;
-  }
-
-  &-start,
-  &-cancel {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    color: @upload-text-item-color-status-icon;
-    font-size: @upload-text-item-size-status-icon;
-    transform: translateX(-50%) translateY(-50%);
-  }
-
-  &-upload {
-    color: @upload-text-item-color-reupload-icon;
-    font-size: @upload-text-item-size-reupload-icon;
-    cursor: pointer;
-    transition: all @transition-duration-2 ease;
-
-    &:active,
-    &:hover {
-      color: @upload-text-item-color-reupload-icon_hover;
-    }
-  }
-}
-
-.@{upload-prefix-cls}-list {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-
-  &&-type-text,
-  &&-type-picture {
-    width: 100%;
-
-    .@{upload-prefix-cls}-list-item:first-of-type {
-      margin-top: @upload-list-margin-top;
-    }
-  }
-
-  /*** listtype is text ****/
-  &-item-done &-item-file-icon {
-    color: @upload-text-item-color-file-icon_success;
-  }
-
-  &-item {
-    position: relative;
-    display: flex;
-    align-items: center;
-    box-sizing: border-box;
-    margin-top: @upload-text-item-margin-top;
-
-    &-content {
-      display: flex;
-      flex: 1;
-      flex-wrap: nowrap;
-      align-items: center;
-      box-sizing: border-box;
-      width: 100%;
-      padding: @upload-text-item-padding-vertical 0;
-      padding-right: @upload-text-item-padding-right;
-      padding-left: @upload-text-item-padding-left;
-      overflow: hidden;
-      font-size: @upload-text-item-font-size;
-      background-color: @upload-text-item-color-bg;
-      border-radius: @upload-text-item-border-radius;
-      transition: background-color @transition-duration-1 @transition-timing-function-linear;
-    }
-
-    &-file-icon {
-      margin-right: @upload-text-item-margin-file-icon-right;
-      color: @upload-text-item-color-file-icon;
-      font-size: @upload-text-item-size-file-icon;
-      line-height: @upload-text-item-size-file-icon;
-    }
-
-    &-thumbnail {
-      flex-shrink: 0;
-      width: @upload-text-item-thumbnail-width;
-      height: @upload-text-item-thumbnail-width;
-      margin-right: @upload-text-item-margin-thumbnail-right;
-
-      img {
-        width: 100%;
-        height: 100%;
-      }
-    }
-
-    &-name {
-      display: flex;
-      flex: 1;
-      align-items: center;
-      margin-right: @upload-text-item-margin-status-left;
-      overflow: hidden;
-      color: @upload-text-item-color-text;
-      font-size: @upload-text-item-font-size;
-      line-height: 1.4286;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-
-      &-link {
-        overflow: hidden;
-        color: @upload-text-item-color-link;
-        text-decoration: none;
-        text-overflow: ellipsis;
-        cursor: pointer;
-      }
-
-      &-text {
-        overflow: hidden;
-        text-overflow: ellipsis;
-        cursor: pointer;
-      }
-    }
-
-    & .@{upload-prefix-cls}-progress {
-      position: relative;
-      margin-left: auto;
-      line-height: @upload-text-item-size-status-icon;
-
-      &:hover {
-        .@{prefix}-progress-circle-bg {
-          stroke: @upload-text-item-color-progress-bg_hover;
-        }
-
-        .@{prefix}-progress-circle-bar {
-          stroke: @upload-text-item-color-progress-bg_hover_active;
-        }
-      }
-    }
-
-    &-operation {
-      margin-left: @upload-text-item-margin-remove-icon-left;
-      color: @upload-text-item-color-remove-icon;
-      font-size: @upload-text-item-size-operation-icon;
-
-      .@{upload-prefix-cls}-icon-remove {
-        font-size: inherit;
-      }
-    }
-  }
-
-  &-item-error,
-  &-item-done {
-    .@{upload-prefix-cls}-list-status {
-      display: none;
-    }
-  }
-
-  &-type-text {
-    .@{upload-prefix-cls}-list-item-error .@{upload-prefix-cls}-list-item-name-link,
-    .@{upload-prefix-cls}-list-item-error .@{upload-prefix-cls}-list-item-name {
-      color: @upload-text-item-color-text_error;
-    }
-
-    .@{upload-prefix-cls}-list-item-done
-      .@{upload-prefix-cls}-list-item-name
-      when
-      not(@upload-text-item-color-text_success = unset) {
-      color: @upload-text-item-color-text_success;
-    }
-
-    .@{upload-prefix-cls}-list-item-uploading
-      .@{upload-prefix-cls}-list-item-name
-      when
-      not(@upload-text-item-color-text_uploading = unset) {
-      color: @upload-text-item-color-text_uploading;
-    }
-  }
-
-  /*** end ****/
-  &&-type-picture-card {
-    display: flex;
-    flex-wrap: wrap;
-    vertical-align: top;
-
-    .@{upload-prefix-cls}-list-status {
-      top: 50%;
-      margin-left: 0;
-      transform: translateY(-50%);
-    }
-  }
-
-  &-picture {
-    display: inline-block;
-    margin-top: 0;
-    margin-right: @upload-picture-item-margin-right;
-    margin-bottom: @upload-picture-item-margin-bottom;
-    padding-right: 0;
-    overflow: hidden;
-    vertical-align: top;
-    transition: all @transition-duration-2 @transition-timing-function-standard;
-  }
-
-  &-picture-status-error &-picture-mask {
-    opacity: 1;
-  }
-
-  &-picture {
-    position: relative;
-    box-sizing: border-box;
-    width: @upload-picture-item-size-width;
-    height: @upload-picture-item-size-width;
-    overflow: hidden;
-    line-height: @upload-picture-item-size-width;
-    text-align: center;
-    vertical-align: top;
-    border-radius: @upload-picture-item-border-radius;
-
-    img {
-      width: 100%;
-      height: 100%;
-    }
-
-    &-mask {
-      position: absolute;
-      inset: 0;
-      color: @upload-picture-item-color-operation-icon;
-      font-size: @upload-picture-item-size-mask-icon;
-      line-height: @upload-picture-item-size-width;
-      text-align: center;
-      background: @upload-picture-item-color-operation_bg;
-      cursor: pointer;
-      opacity: 0;
-      transition: opacity @transition-duration-1 @transition-timing-function-linear;
-    }
-
-    &-operation {
-      display: none;
-      font-size: @upload-picture-item-size-operation-icon;
-
-      .@{upload-prefix-cls}-icon-retry {
-        color: @upload-picture-item-color-operation-icon;
-      }
-    }
-
-    &-error-tip {
-      .@{upload-prefix-cls}-icon-error {
-        color: @upload-picture-item-color-error-icon;
-        font-size: @upload-picture-item-size-error-icon;
-      }
-    }
-
-    &-mask:hover {
-      opacity: 1;
-    }
-
-    &-mask:hover &-operation {
-      display: flex;
-      justify-content: space-evenly;
-    }
-
-    &-mask:hover &-error-tip {
-      display: none;
-    }
-  }
-
-  // picture-list
-  &-type-picture {
-    .@{upload-prefix-cls}-list-item-content {
-      padding-top: @upload-picture-text-item-padding-vertical;
-      padding-bottom: @upload-picture-text-item-padding-vertical;
-    }
-
-    .@{upload-prefix-cls}-list-item-error .@{upload-prefix-cls}-list-item-content {
-      background-color: @upload-picture-text-item-color-bg_error;
-    }
-
-    .@{upload-prefix-cls}-list-item-error .@{upload-prefix-cls}-list-item-name-link,
-    .@{upload-prefix-cls}-list-item-error .@{upload-prefix-cls}-list-item-name {
-      color: @upload-picture-text-item-color-text_error;
-    }
-
-    .@{upload-prefix-cls}-list-item-done
-      .@{upload-prefix-cls}-list-item-name
-      when
-      not(@upload-picture-text-item-color-text_success = unset) {
-      color: @upload-picture-text-item-color-text_success;
-    }
-
-    .@{upload-prefix-cls}-list-item-uploading
-      .@{upload-prefix-cls}-list-item-name
-      when
-      not(@upload-picture-text-item-color-text_uploading = unset) {
-      color: @upload-picture-text-item-color-text_uploading;
-    }
-  }
-}
-
-.@{upload-prefix-cls}-hide + .@{upload-prefix-cls}-list {
-  .@{upload-prefix-cls}-list-item:first-of-type {
-    margin-top: 0;
-  }
-}
-
-.@{upload-prefix-cls}-slide-up-enter {
-  opacity: 0;
-}
-
-.@{upload-prefix-cls}-slide-up-enter-active {
-  opacity: 1;
-  transition: opacity @transition-duration-2 @transition-timing-function-standard;
-}
-
-.@{upload-prefix-cls}-slide-up-exit {
-  opacity: 1;
-}
-
-.@{upload-prefix-cls}-slide-up-exit-active {
-  margin: 0;
-  overflow: hidden;
-  opacity: 0;
-  transition:
-    opacity @transition-duration-1 @transition-timing-function-linear,
-    height @transition-duration-3 @transition-timing-function-standard @transition-duration-1,
-    margin @transition-duration-3 @transition-timing-function-standard @transition-duration-1;
-}
-
-.@{upload-prefix-cls}-list-item {
-  &.@{upload-prefix-cls}-slide-inline-enter {
-    opacity: 0;
-  }
-
-  &.@{upload-prefix-cls}-slide-inline-enter-active {
-    opacity: 1;
-    transition: opacity @transition-duration-2 @transition-timing-function-linear;
-  }
-
-  &.@{upload-prefix-cls}-slide-inline-exit {
-    opacity: 1;
-  }
-
-  &.@{upload-prefix-cls}-slide-inline-exit-active {
-    margin: 0;
-    overflow: hidden;
-    opacity: 0;
-    transition:
-      opacity @transition-duration-1 @transition-timing-function-linear,
-      width @transition-duration-3 @transition-timing-function-standard @transition-duration-1,
-      margin @transition-duration-3 @transition-timing-function-standard @transition-duration-1;
-  }
-}

package/es/upload/style/token.less

@@ -1,181 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@upload-tip-color-text: var(~'@{sd-cssvars-prefix}-color-text-3');
-
-@upload-tip-margin-top: @spacing-2;
-
-@upload-tip-font-size: @font-size-body-1;
-
-@upload-list-margin-top: @spacing-9;
-
-@upload-picture-item-width: @size-20;
-
-@upload-picture-color-bg: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@upload-picture-border-radius: @radius-small;
-
-@upload-picture-border-width: @border-1;
-
-@upload-picture-border-style: @border-dashed;
-
-@upload-picture-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@upload-picture-color-border_disabled: var(~'@{sd-cssvars-prefix}-color-neutral-4');
-
-@upload-picture-color-border_hover: var(~'@{sd-cssvars-prefix}-color-neutral-4');
-
-@upload-picture-color-bg_hover: var(~'@{sd-cssvars-prefix}-color-fill-3');
-
-@upload-picture-color-bg_disabled: var(~'@{sd-cssvars-prefix}-color-fill-1');
-
-@upload-picture-color-text: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@upload-picture-color-text_hover: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@upload-picture-color-text_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@upload-drag-font-size: @font-size-body-3;
-
-@upload-drag-border-radius: @radius-small;
-
-@upload-drag-color-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@upload-drag-tip-margin-top: 0;
-
-@upload-drag-border-style: @border-dashed;
-
-@upload-drag-border-width: @border-1;
-
-@upload-drag-padding-vertical: 50px;
-
-@upload-drag-margin-icon-bottom: 24px;
-
-@upload-drag-color-bg: var(~'@{sd-cssvars-prefix}-color-fill-1');
-
-@upload-drag-color-bg_hover: var(~'@{sd-cssvars-prefix}-color-fill-3');
-
-@upload-drag-color-bg_active: var(~'@{sd-cssvars-prefix}-color-primary-light-1');
-
-@upload-drag-color-bg_disabled: @upload-drag-color-bg;
-
-@upload-drag-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@upload-drag-color-border_active: @color-primary-6;
-
-@upload-drag-color-border_hover: var(~'@{sd-cssvars-prefix}-color-neutral-4');
-
-@upload-drag-color-border_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@upload-drag-color-icon: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@upload-drag-color-icon_hover: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@upload-drag-color-icon_active: @color-primary-6;
-
-@upload-drag-color-text_hover: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@upload-drag-color-text_active: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@upload-drag-color-text_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@upload-text-item-size-operation-icon: @size-3;
-
-@upload-text-item-margin-top: @spacing-6;
-
-@upload-text-item-font-size: @font-size-body-3;
-
-@upload-text-item-color-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@upload-text-item-padding-left: @spacing-6;
-
-@upload-text-item-padding-right: @spacing-5;
-
-@upload-text-item-color-bg: var(~'@{sd-cssvars-prefix}-color-fill-1');
-
-@upload-text-item-padding-vertical: @spacing-4;
-
-@upload-text-item-margin-remove-icon-left: @spacing-6;
-
-@upload-text-item-color-remove-icon: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@upload-text-item-color-status-icon: var(~'@{sd-cssvars-prefix}-color-white');
-
-@upload-text-item-color-file-icon_success: @color-primary-6;
-
-@upload-text-item-color-progress-bg_hover: rgba(var(~'@{sd-cssvars-prefix}-gray-10'), 0.2);
-
-@upload-text-item-color-progress-bg_hover_active: @color-primary-7;
-
-@upload-text-item-size-file-icon: @size-4;
-
-@upload-text-item-margin-file-icon-right: @spacing-6;
-
-@upload-text-item-color-file-icon: @color-primary-6;
-
-@upload-text-item-color-link: @color-link-6;
-
-@upload-text-item-color-reupload-icon: @color-primary-6;
-
-@upload-text-item-color-reupload-icon_hover: @color-primary-7;
-
-@upload-text-item-size-status-icon: @size-3;
-
-@upload-text-item-color-error-icon: @color-danger-6;
-
-@upload-text-item-color-success-icon: @color-success-6;
-
-@upload-text-item-color-text_success: unset;
-
-@upload-text-item-color-text_uploading: unset;
-
-@upload-text-item-border-radius: @radius-small;
-
-@upload-text-item-margin-error-icon-left: @spacing-2;
-
-@upload-text-item-margin-status-left: @spacing-5;
-
-@upload-text-item-thumbnail-width: @size-10;
-
-@upload-text-item-margin-thumbnail-right: @spacing-6;
-
-@upload-text-item-color-text_error: @color-danger-6;
-
-@upload-picture-item-margin-preview-icon-right: @spacing-8;
-
-@upload-picture-item-size-width: @size-20;
-
-@upload-picture-item-border-radius: @radius-small;
-
-@upload-picture-item-margin-right: @spacing-4;
-
-@upload-picture-item-margin-bottom: @spacing-4;
-
-@upload-picture-item-color-operation_bg: rgba(0, 0, 0, 0.5);
-
-@upload-picture-item-color-operation-icon: var(~'@{sd-cssvars-prefix}-color-white');
-
-@upload-picture-item-color-error-icon: var(~'@{sd-cssvars-prefix}-color-white');
-
-@upload-picture-text-item-color-bg_error: var(~'@{sd-cssvars-prefix}-color-danger-light-1');
-
-@upload-picture-text-item-color-text_error: @color-danger-6;
-
-@upload-picture-text-item-padding-vertical: @spacing-4;
-
-@upload-picture-text-item-color-text_success: unset;
-
-@upload-picture-text-item-color-text_uploading: unset;
-
-@upload-drag-size-icon: 14px;
-
-@upload-picture-item-size-mask-icon: @size-4;
-
-@upload-picture-item-size-error-icon: 26px;
-
-@upload-text-item-size-reupload-icon: 14px;
-
-@upload-text-item-size-success-icon: 14px;
-
-@upload-text-item-size-error-icon: 14px;
-
-@upload-picture-item-size-operation-icon: 14px;

package/es/verification-code/style/index.less

@@ -1,32 +0,0 @@
-@import url('./token.less');
-@import url('../../input/style/token.less');
-
-@verification-code-prefix-cls: ~'@{prefix}-verification-code';
-@input-prefix-cls: ~'@{prefix}-input';
-
-.@{verification-code-prefix-cls} {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  width: 100%;
-  column-gap: 4px;
-
-  .@{input-prefix-cls} {
-    width: @input-size-default-height;
-    padding-right: 0;
-    padding-left: 0;
-    text-align: center;
-  }
-
-  .@{input-prefix-cls}-size-small {
-    width: @input-size-small-height;
-  }
-
-  .@{input-prefix-cls}-size-mini {
-    width: @input-size-mini-height;
-  }
-
-  .@{input-prefix-cls}-size-large {
-    width: @input-size-large-height;
-  }
-}

package/es/verification-code/style/token.less

@@ -1 +0,0 @@
-@import url('../../style/theme/index.less');