@sdata/web-vue 1.5.0 → 1.7.0

package/es/menu/style/token.less

@@ -1,117 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@menu-font-size: 14px;
-@menu-line-height: @line-height-base;
-@menu-border-radius: @radius-small;
-@menu-font-weight-item-selected: @font-weight-500;
-@menu-color-label-item-selected: @color-primary-6;
-@menu-height-label-item-selected: 3px;
-@menu-margin-left-item-suffix-icon: @spacing-3;
-@menu-margin-right-item-prefix-icon: @spacing-7;
-@menu-horizontal-margin-right-item-prefix-icon: @spacing-7;
-
-// vertical 模式下 item 之间的间隙
-@menu-item-gap: @spacing-2;
-// vertical 下嵌套子菜单的层级缩进
-@menu-item-indent-spacing: @spacing-8;
-
-// 折叠按钮
-@menu-width-collapse-button: @size-6;
-@menu-height-collapse-button: @size-6;
-@menu-border-radius-collapse-button: @radius-small;
-
-/**********************************************
- * theme: light / dark
- * status: default / disabled / selected / hover
- **********************************************/
-@menu-light-color-bg: var(~'@{sd-cssvars-prefix}-color-menu-light-bg');
-@menu-light-color-bg-item_default: @menu-light-color-bg;
-@menu-light-color-bg-item_hover: var(~'@{sd-cssvars-prefix}-color-fill-2');
-@menu-light-color-bg-item_selected: var(~'@{sd-cssvars-prefix}-color-fill-2');
-@menu-light-color-bg-item_disabled: @menu-light-color-bg;
-@menu-light-color-item_default: var(~'@{sd-cssvars-prefix}-color-text-2');
-@menu-light-color-item_hover: var(~'@{sd-cssvars-prefix}-color-text-2');
-@menu-light-color-item_selected: @color-primary-6;
-@menu-light-color-submenu_selected: @color-primary-6;
-@menu-light-color-bg-submenu_selected_hover: var(~'@{sd-cssvars-prefix}-color-fill-2');
-@menu-light-color-item_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-@menu-light-color-icon_default: var(~'@{sd-cssvars-prefix}-color-text-3');
-@menu-light-color-icon_hover: var(~'@{sd-cssvars-prefix}-color-text-3');
-@menu-light-color-icon_selected: @color-primary-6;
-@menu-light-color-icon_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-@menu-light-color-group-title: var(~'@{sd-cssvars-prefix}-color-text-3');
-
-@menu-dark-color-bg: var(~'@{sd-cssvars-prefix}-color-menu-dark-bg');
-@menu-dark-color-bg-item_default: @menu-dark-color-bg;
-@menu-dark-color-bg-item_hover: var(~'@{sd-cssvars-prefix}-color-menu-dark-hover');
-@menu-dark-color-bg-item_selected: var(~'@{sd-cssvars-prefix}-color-menu-dark-hover');
-@menu-dark-color-bg-item_disabled: @menu-dark-color-bg;
-@menu-dark-color-submenu_selected: @color-primary-6;
-@menu-dark-color-bg-submenu_selected_hover: var(~'@{sd-cssvars-prefix}-color-menu-dark-hover');
-@menu-dark-color-item_default: var(~'@{sd-cssvars-prefix}-color-text-4');
-@menu-dark-color-item_hover: var(~'@{sd-cssvars-prefix}-color-text-4');
-@menu-dark-color-item_selected: var(~'@{sd-cssvars-prefix}-color-white');
-@menu-dark-color-item_disabled: var(~'@{sd-cssvars-prefix}-color-text-2');
-@menu-dark-color-icon_default: var(~'@{sd-cssvars-prefix}-color-text-3');
-@menu-dark-color-icon_hover: var(~'@{sd-cssvars-prefix}-color-text-3');
-@menu-dark-color-icon_selected: var(~'@{sd-cssvars-prefix}-color-white');
-@menu-dark-color-icon_disabled: var(~'@{sd-cssvars-prefix}-color-text-2');
-@menu-dark-color-group-title: var(~'@{sd-cssvars-prefix}-color-text-3');
-
-// popup sub-menu
-@menu-color-border-popup: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-// collapse button style
-@menu-light-color-bg-button: var(~'@{sd-cssvars-prefix}-color-fill-1');
-@menu-light-color-bg-button_hover: var(~'@{sd-cssvars-prefix}-color-fill-3');
-@menu-light-color-button: var(~'@{sd-cssvars-prefix}-color-text-3');
-@menu-dark-color-bg-button: @color-primary-6;
-@menu-dark-color-bg-button_hover: @color-primary-7;
-@menu-dark-color-button: var(~'@{sd-cssvars-prefix}-color-white');
-
-/**********************************************
- * horizontal / vertical
- **********************************************/
-@menu-horizontal-padding-vertical: 14px;
-@menu-horizontal-padding-horizontal: @spacing-8;
-@menu-horizontal-item-gap: @spacing-6;
-@menu-horizontal-item-height: 30px;
-@menu-horizontal-item-padding-horizontal: @spacing-6;
-
-@menu-vertical-padding-vertical: @spacing-2;
-@menu-vertical-padding-horizontal: @spacing-4;
-@menu-vertical-item-height: 40px;
-@menu-vertical-item-padding-horizontal: @spacing-6;
-
-/************************************************
- * collapse
- ***********************************************/
-@menu-collapse-width: @size-12;
-@menu-collapse-padding-vertical: @spacing-2;
-@menu-collapse-padding-horizontal: @spacing-2;
-
-/************************************************
- * popButton
- ***********************************************/
-@menu-pop-button-size: @size-10;
-@menu-pop-button-margin-bottom: @spacing-7;
-@menu-pop-button-box-shadow: @shadow2-down;
-@menu-pop-button-border-color: @color-transparent;
-
-/**********************************************
- * Theme dark in dropdown
- **********************************************/
-@dropdown-dark-color-bg: var(~'@{sd-cssvars-prefix}-color-menu-dark-bg');
-@dropdown-dark-color-border: @dropdown-dark-color-bg;
-
-@dropdown-dark-option-color-bg_default: @color-transparent;
-@dropdown-dark-option-color-bg_hover: var(~'@{sd-cssvars-prefix}-color-menu-dark-hover');
-@dropdown-dark-option-color-bg_selected: @color-transparent;
-@dropdown-dark-option-color-bg_disabled: @color-transparent;
-
-@dropdown-dark-option-color-text_default: var(~'@{sd-cssvars-prefix}-color-text-4');
-@dropdown-dark-option-color-text_hover: var(~'@{sd-cssvars-prefix}-color-text-4');
-@dropdown-dark-option-color-text_selected: var(~'@{sd-cssvars-prefix}-color-white');
-@dropdown-dark-option-color-text_disabled: var(~'@{sd-cssvars-prefix}-color-text-2');
-
-@dropdown-dark-group-title-color-text: var(~'@{sd-cssvars-prefix}-color-text-3');

package/es/message/style/index.less

@@ -1,190 +0,0 @@
-@import url('../../style/mixins/index.less');
-@import url('./token.less');
-
-@message-prefix-cls: ~'@{prefix}-message';
-
-.@{message-prefix-cls}-list {
-  position: fixed;
-  left: 0;
-  z-index: @z-index-message;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  box-sizing: border-box;
-  width: 100%;
-  margin: 0;
-  padding: 0 10px;
-  text-align: center;
-  pointer-events: none;
-
-  &-top {
-    top: @message-wrapper-margin-top;
-  }
-
-  &-bottom {
-    bottom: @message-wrapper-margin-bottom;
-  }
-}
-
-.@{message-prefix-cls} {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  margin-bottom: @message-margin-bottom;
-  padding: @message-padding-top @message-padding-right @message-padding-bottom @message-padding-left;
-  overflow: hidden;
-  line-height: 1;
-  text-align: center;
-  list-style: none;
-  background-color: @message-normal-color-bg;
-  border: @message-border-width @message-border-style @message-normal-color-border;
-  border-radius: @message-border-radius;
-  box-shadow: @shadow2-down;
-  transition: all @transition-duration-1 @transition-timing-function-linear;
-  pointer-events: auto;
-
-  &-icon {
-    display: inline-block;
-    margin-right: @message-icon-margin-right;
-    color: @message-normal-color-icon;
-    font-size: @message-font-size-icon;
-    vertical-align: middle;
-    animation:
-      ~'@{prefix}-msg-fade' @transition-duration-1 @transition-timing-function-linear,
-      ~'@{prefix}-msg-fade' @transition-duration-4 @transition-timing-function-overshoot;
-  }
-
-  &-content {
-    color: @message-normal-color-content;
-    font-size: @message-font-size-content;
-    vertical-align: middle;
-  }
-
-  &-info {
-    background-color: @message-info-color-bg;
-    border-color: @message-info-color-border;
-  }
-
-  &-info &-icon {
-    color: @message-info-color-icon;
-  }
-
-  &-info &-content {
-    color: @message-info-color-content;
-  }
-
-  &-success {
-    background-color: @message-success-color-bg;
-    border-color: @message-success-color-border;
-  }
-
-  &-success &-icon {
-    color: @message-success-color-icon;
-  }
-
-  &-success &-content {
-    color: @message-success-color-content;
-  }
-
-  &-warning {
-    background-color: @message-warning-color-bg;
-    border-color: @message-warning-color-border;
-  }
-
-  &-warning &-icon {
-    color: @message-warning-color-icon;
-  }
-
-  &-warning &-content {
-    color: @message-warning-color-content;
-  }
-
-  &-error {
-    background-color: @message-error-color-bg;
-    border-color: @message-error-color-border;
-  }
-
-  &-error &-icon {
-    color: @message-error-color-icon;
-  }
-
-  &-error &-content {
-    color: @message-error-color-content;
-  }
-
-  &-loading {
-    background-color: @message-loading-color-bg;
-    border-color: @message-loading-color-border;
-  }
-
-  &-loading &-icon {
-    color: @message-loading-color-icon;
-  }
-
-  &-loading &-content {
-    color: @message-loading-color-content;
-  }
-
-  &-close-btn {
-    margin-left: 8px;
-    color: @message-color-close-icon;
-    font-size: @message-close-icon-font-size;
-  }
-
-  .icon-hover(
-    @message-prefix-cls,
-    @message-close-icon-font-size,
-      @message-close-icon-font-size + 8px
-  );
-}
-
-.fade-message-enter-from,
-.fade-message-appear-from {
-  opacity: 0;
-}
-
-.fade-message-enter-to,
-.fade-message-appear-to {
-  opacity: 1;
-}
-
-.fade-message-enter-active,
-.fade-message-appear-active {
-  transition: opacity @transition-duration-1 @transition-timing-function-linear;
-}
-
-.fade-message-leave-from {
-  opacity: 1;
-}
-
-.fade-message-leave-to {
-  opacity: 0;
-}
-
-.fade-message-leave-active {
-  position: absolute;
-}
-
-.flip-list-move {
-  transition: transform 0.8s ease;
-}
-
-@keyframes ~ '@{prefix}-msg-fade' {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
-@keyframes ~ '@{prefix}-msg-scale' {
-  from {
-    transform: scale(0);
-  }
-
-  to {
-    transform: scale(1);
-  }
-}

package/es/message/style/token.less

@@ -1,83 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@message-wrapper-margin-top: @spacing-12;
-
-@message-wrapper-margin-bottom: @spacing-12;
-
-@message-padding-top: @spacing-5;
-
-@message-padding-bottom: @spacing-5;
-
-@message-padding-left: @spacing-7;
-
-@message-padding-right: @spacing-7;
-
-@message-margin-bottom: @spacing-7;
-
-@message-border-radius: @radius-small;
-
-@message-font-size-icon: 20px;
-
-@message-font-size-content: @font-size-body-3;
-
-@message-icon-margin-right: @spacing-4;
-
-@message-border-width: 1px;
-
-@message-border-style: solid;
-
-@message-color-close-icon: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-close-icon-font-size: 12px;
-
-@message-close-icon-top: 15px;
-
-@message-close-icon-right: @spacing-7;
-
-@message-normal-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-@message-normal-color-icon: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-normal-color-content: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-normal-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@message-info-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-@message-info-color-icon: @color-primary-6;
-
-@message-info-color-content: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-info-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@message-success-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-@message-success-color-icon: @color-success-6;
-
-@message-success-color-content: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-success-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@message-warning-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-@message-warning-color-icon: @color-warning-6;
-
-@message-warning-color-content: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-warning-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@message-error-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-@message-error-color-icon: @color-danger-6;
-
-@message-error-color-content: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-error-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@message-loading-color-bg: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-
-@message-loading-color-icon: @color-primary-6;
-
-@message-loading-color-content: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@message-loading-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');

package/es/modal/style/index.less

@@ -1,269 +0,0 @@
-@import url('./token.less');
-
-@modal-prefix-cls: ~'@{prefix}-modal';
-
-.@{modal-prefix-cls}-container {
-  position: fixed;
-  inset: 0;
-}
-
-.@{modal-prefix-cls}-mask {
-  position: absolute;
-  inset: 0;
-  background-color: var(~'@{sd-cssvars-prefix}-color-mask-bg');
-}
-
-.@{modal-prefix-cls}-wrapper {
-  position: absolute;
-  inset: 0;
-  overflow: auto;
-  text-align: center;
-
-  &&-align-center {
-    white-space: nowrap;
-
-    &::after {
-      display: inline-block;
-      width: 0;
-      height: 100%;
-      vertical-align: middle;
-      content: '';
-    }
-
-    .@{modal-prefix-cls} {
-      top: 0;
-      vertical-align: middle;
-    }
-  }
-
-  &&-moved {
-    text-align: left;
-
-    .@{modal-prefix-cls} {
-      top: 0;
-      vertical-align: top;
-    }
-  }
-}
-
-.@{modal-prefix-cls} {
-  position: relative;
-  top: @modal-margin-top;
-  display: inline-block;
-  width: @modal-default-size-width;
-  margin: 0 auto;
-  line-height: @line-height-base;
-  white-space: initial;
-  text-align: left;
-  background-color: var(~'@{sd-cssvars-prefix}-color-bg-3');
-  border-radius: @modal-border-radius;
-
-  &-draggable {
-    .@{modal-prefix-cls}-header {
-      cursor: move;
-    }
-  }
-
-  &-header {
-    display: flex;
-    flex-shrink: 0;
-    align-items: center;
-    box-sizing: border-box;
-    width: 100%;
-    height: @modal-default-size-header-height;
-    padding: 0 @modal-default-padding-horizontal;
-    border-bottom: @border-1 solid @modal-color-border;
-
-    .@{modal-prefix-cls}-title {
-      display: flex;
-      flex: 1;
-      align-items: center;
-      justify-content: if(
-        (@modal-default-align-header = left),
-        flex-start,
-        (if((@modal-default-align-header = right), flex-end, center))
-      );
-
-      &-align-start {
-        justify-content: flex-start;
-      }
-
-      &-align-center {
-        justify-content: center;
-      }
-    }
-  }
-
-  &-body {
-    position: relative;
-    padding: @modal-default-padding-content-vertical @modal-default-padding-horizontal;
-    overflow: auto;
-    color: @modal-color-content-text;
-    font-size: @modal-font-content-size;
-  }
-
-  &-footer {
-    flex-shrink: 0;
-    box-sizing: border-box;
-    width: 100%;
-    padding: @modal-default-padding-footer-vertical @modal-default-padding-horizontal;
-    text-align: right;
-    border-top: @border-1 solid @modal-color-border;
-
-    > .@{prefix}-btn:not(:nth-child(1)) {
-      margin-left: @modal-margin-footer-button-left;
-    }
-  }
-
-  &-close-btn {
-    margin-left: -@modal-font-size-close-icon;
-    color: @modal-color-header-text;
-    font-size: @modal-font-size-close-icon;
-    cursor: pointer;
-  }
-
-  &-title {
-    color: @modal-color-header-text;
-    font-weight: @font-weight-500;
-    font-size: @modal-font-header-size;
-
-    &-icon {
-      margin-right: @modal-margin-tip-icon-right;
-      font-size: @modal-size-tip-icon;
-      vertical-align: -0.15em;
-
-      .@{prefix}-icon-info-circle-fill {
-        color: @color-primary-6;
-      }
-
-      .@{prefix}-icon-check-circle-fill {
-        color: @color-success-6;
-      }
-
-      .@{prefix}-icon-exclamation-circle-fill {
-        color: @color-warning-6;
-      }
-
-      .@{prefix}-icon-close-circle-fill {
-        color: @color-danger-6;
-      }
-    }
-  }
-}
-
-// 简洁模式
-.@{modal-prefix-cls}-simple {
-  width: @modal-simple-size-width;
-  padding: @modal-simple-padding-top @modal-simple-padding-horizontal @modal-simple-padding-bottom;
-
-  .@{modal-prefix-cls}-header,
-  .@{modal-prefix-cls}-footer {
-    height: unset;
-    padding: 0;
-    border: none;
-  }
-
-  .@{modal-prefix-cls}-header {
-    margin-bottom: @modal-simple-margin-content-top;
-  }
-
-  .@{modal-prefix-cls}-title {
-    justify-content: if(
-      (@modal-default-align-header = left),
-      flex-start,
-      (if((@modal-default-align-header = right), flex-end, center))
-    );
-
-    &-align-start {
-      justify-content: flex-start;
-    }
-
-    &-align-center {
-      justify-content: center;
-    }
-  }
-
-  .@{modal-prefix-cls}-footer {
-    margin-top: @modal-simple-margin-footer-top;
-    text-align: center;
-  }
-
-  .@{modal-prefix-cls}-body {
-    padding: 0;
-  }
-}
-
-.@{modal-prefix-cls}-fullscreen {
-  top: 0;
-  display: inline-flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  width: 100%;
-  height: 100%;
-
-  .@{modal-prefix-cls}-footer {
-    margin-top: auto;
-  }
-}
-
-.zoom-modal-enter-from,
-.zoom-modal-appear-from {
-  transform: scale(0.5, 0.5);
-  opacity: 0;
-}
-
-.zoom-modal-enter-to,
-.zoom-modal-appear-to {
-  transform: scale(1, 1);
-  opacity: 1;
-}
-
-.zoom-modal-enter-active,
-.zoom-modal-appear-active {
-  transition:
-    opacity @transition-duration-4 @transition-timing-function-overshoot,
-    transform @transition-duration-4 @transition-timing-function-overshoot;
-}
-
-.zoom-modal-leave-from {
-  transform: scale(1, 1);
-  opacity: 1;
-}
-
-.zoom-modal-leave-to {
-  transform: scale(0.5, 0.5);
-  opacity: 0;
-}
-
-.zoom-modal-leave-active {
-  transition:
-    opacity @transition-duration-4 @transition-timing-function-overshoot,
-    transform @transition-duration-4 @transition-timing-function-overshoot;
-}
-
-.fade-modal-enter-from,
-.fade-modal-appear-from {
-  opacity: 0;
-}
-
-.fade-modal-enter-to,
-.fade-modal-appear-to {
-  opacity: 1;
-}
-
-.fade-modal-enter-active,
-.fade-modal-appear-active {
-  transition: opacity @transition-duration-4 @transition-timing-function-overshoot;
-}
-
-.fade-modal-leave-from {
-  opacity: 1;
-}
-
-.fade-modal-leave-to {
-  opacity: 0;
-}
-
-.fade-modal-leave-active {
-  transition: opacity @transition-duration-4 @transition-timing-function-overshoot;
-}

package/es/modal/style/token.less

@@ -1,51 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@modal-border-radius: @radius-medium;
-
-@modal-size-tip-icon: 18px;
-
-@modal-margin-top: 100px;
-
-@modal-margin-tip-icon-right: @spacing-5;
-
-@modal-margin-footer-button-left: @spacing-6;
-
-@modal-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@modal-color-header-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@modal-color-content-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@modal-font-header-size: @font-size-title-1;
-
-@modal-default-padding-horizontal: @spacing-8;
-
-@modal-default-size-header-height: @size-12;
-
-@modal-default-padding-content-vertical: @spacing-9;
-
-@modal-default-padding-footer-vertical: @spacing-7;
-
-@modal-default-size-width: 520px;
-
-@modal-font-content-size: @font-size-body-3;
-
-@modal-default-align-header: center;
-
-@modal-simple-align-header: center;
-
-@modal-simple-size-width: 400px;
-
-@modal-simple-padding-horizontal: @spacing-10;
-
-@modal-simple-padding-top: @spacing-9;
-
-@modal-simple-padding-bottom: @spacing-10;
-
-@modal-simple-margin-footer-top: @spacing-10;
-
-@modal-simple-margin-content-top: @spacing-9;
-
-@modal-position-close-icon-right: 16px;
-
-@modal-font-size-close-icon: 12px;