@sdata/web-vue 1.6.0 → 1.7.0

package/es/avatar/style/index.less

@@ -1,153 +0,0 @@
-@import url('./token.less');
-
-@avatar-prefix-cls: ~'@{prefix}-avatar';
-
-.@{avatar-prefix-cls} {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  box-sizing: border-box;
-  width: @avatar-size-default;
-  height: @avatar-size-default;
-  color: @avatar-color-text;
-  font-size: @avatar-font-size-text;
-  white-space: nowrap;
-  vertical-align: middle;
-  background-color: @avatar-color-bg;
-
-  &-circle {
-    border-radius: @avatar-circle-border-radius;
-  }
-
-  &-circle &-image {
-    overflow: hidden;
-    border-radius: @avatar-circle-border-radius;
-  }
-
-  &-square {
-    border-radius: @avatar-square-border-radius;
-  }
-
-  &-square &-image {
-    overflow: hidden;
-    border-radius: @avatar-square-border-radius;
-  }
-
-  &-text {
-    position: absolute;
-    left: 50%;
-    font-weight: @avatar-font-weight-text;
-    // 避免继承行高导致的文字不居中
-    line-height: 1;
-    transform: translateX(-50%);
-    transform-origin: 0 center;
-  }
-
-  &-image {
-    display: inline-block;
-    width: 100%;
-    height: 100%;
-
-    &-icon {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      width: 100%;
-      height: 100%;
-    }
-
-    img,
-    picture {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  &-trigger-icon-button {
-    position: absolute;
-    right: -@avatar-spacing-trigger-button-right;
-    bottom: -@avatar-spacing-trigger-button-bottom;
-    z-index: 1;
-    width: @avatar-size-trigger-button;
-    height: @avatar-size-trigger-button;
-    color: @avatar-color-trigger-icon-button;
-    font-size: @avatar-size-trigger-icon;
-    line-height: @avatar-size-trigger-button;
-    text-align: center;
-    background-color: @avatar-color-trigger-button-bg;
-    border-radius: @avatar-border-trigger-button-radius;
-    transition: background-color @transition-duration-1 @transition-timing-function-linear;
-  }
-
-  &-trigger-icon-mask {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    height: 100%;
-    color: @avatar-color-trigger-mask-icon;
-    font-size: 16px;
-    background-color: fade(@gray-10, @avatar-opacity-trigger-mask-bg);
-    border-radius: @avatar-square-border-radius;
-    opacity: 0;
-    transition: all @transition-duration-1 @transition-timing-function-linear;
-  }
-
-  &-circle &-trigger-icon-mask {
-    border-radius: @avatar-circle-border-radius;
-  }
-
-  &-with-trigger-icon {
-    cursor: pointer;
-  }
-
-  &-with-trigger-icon:hover &-trigger-icon-mask {
-    z-index: 2;
-    opacity: 1;
-  }
-
-  &-with-trigger-icon:hover &-trigger-icon-button {
-    background-color: @avatar-color-trigger-button-bg_hover;
-  }
-
-  &-rtl {
-    direction: rtl;
-  }
-
-  &-rtl &-trigger-icon-button {
-    right: unset;
-    left: -@avatar-spacing-trigger-button-right;
-  }
-
-  // Group
-  &-group {
-    display: inline-block;
-    line-height: 0;
-
-    &-max-count-avatar {
-      color: @avatar-color-max-count-text;
-      font-size: @avatar-font-size-max-count;
-      cursor: default;
-    }
-
-    &-rtl {
-      direction: rtl;
-    }
-  }
-
-  &-group & {
-    border: @avatar-group-item-border-width solid @avatar-color-group-item-border;
-  }
-
-  &-group &:not(:first-child) {
-    margin-left: @avatar-group-item-margin-left;
-  }
-
-  &-group-popover &:not(:first-child) {
-    margin-left: @avatar-group-popover-item-spacing;
-  }
-}

package/es/avatar/style/token.less

@@ -1,47 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@avatar-size-default: @size-10;
-
-@avatar-font-size-text: 20px;
-
-@avatar-color-text: var(~'@{sd-cssvars-prefix}-color-white');
-
-@avatar-color-bg: var(~'@{sd-cssvars-prefix}-color-fill-4');
-
-@avatar-color-group-item-border: var(~'@{sd-cssvars-prefix}-color-bg-2');
-
-@avatar-group-item-border-width: 2px;
-
-@avatar-group-item-margin-left: -10px;
-
-@avatar-group-popover-item-spacing: @spacing-2;
-
-@avatar-font-weight-text: @font-weight-500;
-
-@avatar-circle-border-radius: @radius-circle;
-
-@avatar-square-border-radius: @radius-medium;
-
-@avatar-size-trigger-button: @size-5;
-
-@avatar-color-trigger-button-bg: var(~'@{sd-cssvars-prefix}-color-neutral-2');
-
-@avatar-color-trigger-button-bg_hover: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@avatar-color-trigger-mask-icon: var(~'@{sd-cssvars-prefix}-color-white');
-
-@avatar-opacity-trigger-mask-bg: @opacity-6;
-
-@avatar-color-trigger-icon-button: var(~'@{sd-cssvars-prefix}-color-fill-4');
-
-@avatar-spacing-trigger-button-right: @spacing-2;
-
-@avatar-spacing-trigger-button-bottom: @spacing-2;
-
-@avatar-size-trigger-icon: @size-3;
-
-@avatar-border-trigger-button-radius: @radius-circle;
-
-@avatar-font-size-max-count: 20px;
-
-@avatar-color-max-count-text: var(~'@{sd-cssvars-prefix}-color-white');

package/es/back-top/style/index.less

@@ -1,32 +0,0 @@
-@import url('./token.less');
-
-@backtop-prefix-cls: ~'@{prefix}-back-top';
-
-.@{backtop-prefix-cls} {
-  position: fixed;
-  right: @backtop-margin-right;
-  bottom: @backtop-margin-bottom;
-  z-index: 100;
-
-  &-btn {
-    width: @backtop-button-size-width;
-    height: @backtop-button-size-width;
-    color: @backtop-button-color-text;
-    font-size: @backtop-button-size-font;
-    text-align: center;
-    background-color: @backtop-button-color-bg;
-    border: none;
-    border-radius: @backtop-button-border-radius;
-    outline: none;
-    cursor: pointer;
-    transition: all @transition-duration-2 @transition-timing-function-linear;
-
-    &:hover {
-      background-color: @backtop-button-color-bg_hover;
-    }
-
-    svg {
-      font-size: @backtop-button-size-icon;
-    }
-  }
-}

package/es/back-top/style/token.less

@@ -1,19 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@backtop-margin-bottom: @spacing-9;
-
-@backtop-margin-right: @spacing-9;
-
-@backtop-button-size-width: @size-10;
-
-@backtop-button-size-font: @font-size-body-1;
-
-@backtop-button-size-icon: 14px;
-
-@backtop-button-color-bg: @color-primary-6;
-
-@backtop-button-color-bg_hover: @color-primary-5;
-
-@backtop-button-border-radius: @radius-circle;
-
-@backtop-button-color-text: var(~'@{sd-cssvars-prefix}-color-white');

package/es/badge/style/index.less

@@ -1,178 +0,0 @@
-@import url('./token.less');
-
-@badge-prefix-cls: ~'@{prefix}-badge';
-
-.@{badge-prefix-cls} {
-  position: relative;
-  display: inline-block;
-  line-height: 1;
-
-  &-rtl {
-    direction: rtl;
-  }
-
-  &-number,
-  &-dot,
-  &-text,
-  &-custom-dot {
-    position: absolute;
-    top: 2px;
-    right: 2px;
-    z-index: 2;
-    box-sizing: border-box;
-    overflow: hidden;
-    text-align: center;
-    border-radius: @badge-size-count-height;
-    transform: translate(50%, -50%);
-    transform-origin: 100% 0%;
-  }
-
-  &-rtl &-number,
-  &-rtl &-dot,
-  &-rtl &-text,
-  &-rtl &-custom-dot {
-    right: unset;
-  }
-
-  &-custom-dot {
-    background-color: var(~'@{sd-cssvars-prefix}-color-bg-2');
-  }
-
-  &-number,
-  &-text {
-    min-width: @badge-size-count-height;
-    height: @badge-size-count-height;
-    padding: 0 @badge-padding-count-horizontal;
-    color: @badge-color-count-text;
-    font-weight: @badge-font-count-weight;
-    font-size: @badge-font-count-size;
-    line-height: @badge-size-count-height;
-    background-color: @badge-color-count-bg;
-    box-shadow: 0 0 0 2px var(~'@{sd-cssvars-prefix}-color-bg-2');
-  }
-
-  &-dot {
-    width: @badge-size-dot-width;
-    height: @badge-size-dot-width;
-    background-color: @badge-color-count-bg;
-    border-radius: @radius-circle;
-    box-shadow: 0 0 0 2px var(~'@{sd-cssvars-prefix}-color-bg-2');
-  }
-
-  &-no-children &-dot,
-  &-no-children &-number,
-  &-no-children &-text {
-    position: relative;
-    top: unset;
-    right: unset;
-    display: inline-block;
-    transform: none;
-  }
-
-  &-status-wrapper {
-    display: inline-flex;
-    align-items: center;
-  }
-
-  &-status-dot {
-    display: inline-block;
-    width: @badge-size-dot-width;
-    height: @badge-size-dot-width;
-    border-radius: @radius-circle;
-  }
-
-  &-status-normal {
-    background-color: @badge-color-dot-bg_default;
-  }
-
-  &-status-processing {
-    background-color: @badge-color-dot-bg_processing;
-  }
-
-  &-status-success {
-    background-color: @badge-color-dot-bg_success;
-  }
-
-  &-status-warning {
-    background-color: @badge-color-dot-bg_warning;
-  }
-
-  &-status-danger {
-    background-color: @badge-color-dot-bg_error;
-  }
-
-  @colors: red, orangered, orange, gold, lime, green, cyan, sdblue, purple, pinkpurple, magenta,
-    gray;
-
-  .for(@data, @i: 1) when(@i =< length(@data)) {
-    @color-name: extract(@data, @i);
-
-    @color: ~'badge-@{color-name}-color-dot-bg';
-
-    &-color-@{color-name} {
-      background-color: @@color;
-    }
-    .for(@data, (@i + 1));
-  }
-
-  .for(@colors);
-
-  .@{badge-prefix-cls}-status-text {
-    margin-left: @badge-margin-status-text-left;
-    color: @badge-color-status-text;
-    font-size: @badge-font-status-text-size;
-    line-height: @line-height-base;
-  }
-
-  &-rtl &-status-text {
-    margin-right: @badge-margin-status-text-left;
-    margin-left: 0;
-  }
-
-  &-number-text {
-    display: inline-block;
-    animation: ~'@{prefix}-badge-scale' @transition-duration-5 @transition-timing-function-overshoot;
-  }
-}
-
-@keyframes ~'@{prefix}-badge-scale' {
-  from {
-    transform: scale(0, 0);
-  }
-
-  to {
-    transform: scale(1, 1);
-  }
-}
-
-.badge-zoom-enter,
-.badge-zoom-appear {
-  transform: translate(50%, -50%) scale(0.2, 0.2);
-  // opacity: 0;
-  transform-origin: center;
-}
-
-.badge-zoom-enter-active,
-.badge-zoom-appear-active {
-  transform: translate(50%, -50%) scale(1, 1);
-  transform-origin: center;
-  opacity: 1;
-  transition:
-    opacity @transition-duration-3 @transition-timing-function-overshoot,
-    transform @transition-duration-3 @transition-timing-function-overshoot;
-}
-
-.badge-zoom-exit {
-  transform: translate(50%, -50%) scale(1, 1);
-  transform-origin: center;
-  opacity: 1;
-}
-
-.badge-zoom-exit-active {
-  transform: translate(50%, -50%) scale(0.2, 0.2);
-  transform-origin: center;
-  opacity: 0;
-  transition:
-    opacity @transition-duration-3 @transition-timing-function-overshoot,
-    transform @transition-duration-3 @transition-timing-function-overshoot;
-}

package/es/badge/style/token.less

@@ -1,55 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@badge-size-count-height: @size-5;
-
-@badge-padding-count-horizontal: @spacing-3;
-
-@badge-margin-status-text-left: @spacing-4;
-
-@badge-font-count-size: @font-size-body-1;
-
-@badge-font-status-text-size: @font-size-body-1;
-
-@badge-color-count-text: var(~'@{sd-cssvars-prefix}-color-white');
-
-@badge-color-status-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@badge-color-count-bg: @color-danger-6;
-
-@badge-size-dot-width: 6px;
-
-@badge-color-dot-bg_default: var(~'@{sd-cssvars-prefix}-color-fill-4');
-
-@badge-color-dot-bg_processing: @color-primary-6;
-
-@badge-color-dot-bg_success: @color-success-6;
-
-@badge-color-dot-bg_warning: @color-warning-6;
-
-@badge-color-dot-bg_error: @color-danger-6;
-
-@badge-font-count-weight: @font-weight-500;
-
-@badge-red-color-dot-bg: @color-danger-6;
-
-@badge-orangered-color-dot-bg: @orangered-6;
-
-@badge-orange-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-orange-6'));
-
-@badge-lime-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-lime-6'));
-
-@badge-gold-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-gold-6'));
-
-@badge-green-color-dot-bg: @color-success-6;
-
-@badge-cyan-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-cyan-6'));
-
-@badge-sdblue-color-dot-bg: @color-primary-6;
-
-@badge-pinkpurple-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-6'));
-
-@badge-purple-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-purple-6'));
-
-@badge-magenta-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-magenta-6'));
-
-@badge-gray-color-dot-bg: rgb(var(~'@{sd-cssvars-prefix}-gray-4'));

package/es/breadcrumb/style/index.less

@@ -1,76 +0,0 @@
-@import url('./token.less');
-
-@breadcrumb-prefix-cls: ~'@{prefix}-breadcrumb';
-
-.@{breadcrumb-prefix-cls} {
-  display: inline-flex;
-  align-items: center;
-  color: var(~'@{sd-cssvars-prefix}-color-text-2');
-  font-size: @breadcrumb-size-font-size;
-
-  &-icon {
-    color: var(~'@{sd-cssvars-prefix}-color-text-2');
-  }
-
-  &-item {
-    display: inline-block;
-    padding: 0 @breadcrumb-padding-text-horizontal;
-    color: @breadcrumb-color-text;
-    line-height: @breadcrumb-size-text-height;
-    vertical-align: middle;
-
-    > .@{prefix}-icon {
-      color: @breadcrumb-color-icon;
-    }
-
-    a {
-      display: inline-block;
-      margin: 0 -@breadcrumb-padding-text-horizontal;
-      padding: 0 @breadcrumb-padding-text-horizontal;
-      color: @breadcrumb-color-link-text;
-      text-decoration: none;
-      background-color: @breadcrumb-color-bg;
-      border-radius: @breadcrumb-border-text-radius_hover;
-
-      &:hover {
-        color: @breadcrumb-color-link-text_hover;
-        background-color: @breadcrumb-color-bg_hover;
-      }
-    }
-
-    &:last-child {
-      color: @breadcrumb-color-text_active;
-      font-weight: @breadcrumb-font-weight_active;
-    }
-
-    &-ellipses {
-      position: relative;
-      top: -3px;
-      display: inline-block;
-      padding: 0 @breadcrumb-padding-text-horizontal;
-      color: var(~'@{sd-cssvars-prefix}-color-text-2');
-    }
-
-    &-separator {
-      display: inline-block;
-      margin: 0 @breadcrumb-margin-separator-horizontal;
-      color: @breadcrumb-color-separator;
-      line-height: @breadcrumb-size-text-height;
-      vertical-align: middle;
-    }
-
-    &-with-dropdown {
-      cursor: pointer;
-    }
-
-    &-dropdown-icon {
-      margin-left: @breadcrumb-margin-dropdown-icon-left;
-      color: @breadcrumb-color-dropdown-icon;
-      font-size: @breadcrumb-size-dropdown-icon;
-
-      &-active svg {
-        transform: rotate(180deg);
-      }
-    }
-  }
-}

package/es/breadcrumb/style/token.less

@@ -1,37 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@breadcrumb-color-text: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@breadcrumb-color-text_active: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@breadcrumb-color-link-text: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@breadcrumb-color-separator: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@breadcrumb-color-bg_hover: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@breadcrumb-color-bg: @color-transparent;
-
-@breadcrumb-margin-separator-horizontal: @spacing-2;
-
-@breadcrumb-margin-dropdown-icon-left: @spacing-2;
-
-@breadcrumb-padding-text-horizontal: @spacing-2;
-
-@breadcrumb-border-text-radius_hover: @radius-small;
-
-@breadcrumb-size-text-height: @size-6;
-
-@breadcrumb-size-separator-height: @size-3;
-
-@breadcrumb-size-dropdown-icon: @size-3;
-
-@breadcrumb-size-font-size: @font-size-body-3;
-
-@breadcrumb-font-weight_active: @font-weight-500;
-
-@breadcrumb-color-icon: var(~'@{sd-cssvars-prefix}-color-text-3');
-
-@breadcrumb-color-link-text_hover: @color-link-6;
-
-@breadcrumb-color-dropdown-icon: var(~'@{sd-cssvars-prefix}-color-text-2');