@sdata/web-vue 1.6.0 → 1.7.0

package/es/tag/style/token.less

@@ -1,153 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@tag-border-width: 1px;
-@tag-border-type: solid;
-@tag-padding-horizontal: 8px;
-@tag-padding-vertical: 0;
-@tag-icon-margin-right: @spacing-2;
-@tag-text-font-weight: @font-weight-500;
-@tag-border-radius: @radius-small;
-
-@tag-size-small: @size-5;
-@tag-size-default: @size-6;
-@tag-size-medium: @size-7;
-@tag-size-large: @size-8;
-
-@tag-size-small-font-size: 12px;
-@tag-size-default-font-size: 12px;
-@tag-size-medium-font-size: 14px;
-@tag-size-large-font-size: 14px;
-
-@tag-color-bg-not-checked_hover: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@tag-custom-color-text: var(~'@{sd-cssvars-prefix}-color-white');
-@tag-custom-color-icon-bg_hover: rgba(255, 255, 255, 0.2);
-
-@tag-default-color-bg: var(~'@{sd-cssvars-prefix}-color-fill-2');
-@tag-default-color-bg_hover: var(~'@{sd-cssvars-prefix}-color-fill-3');
-@tag-default-color-icon: var(~'@{sd-cssvars-prefix}-color-text-2');
-@tag-default-color-text: var(~'@{sd-cssvars-prefix}-color-text-1');
-@tag-default-color-border: @color-transparent;
-@tag-default-bordered-color-border: var(~'@{sd-cssvars-prefix}-color-border-2');
-@tag-default-color-border_hover: @color-transparent;
-
-@tag-red-color-bg: rgb(var(~'@{sd-cssvars-prefix}-red-1'));
-@tag-red-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-red-2'));
-@tag-red-color-border: @color-transparent;
-@tag-red-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-red-6'));
-@tag-red-color-border_hover: @color-transparent;
-@tag-red-color-icon: rgb(var(~'@{sd-cssvars-prefix}-red-6'));
-@tag-red-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-red-2'));
-@tag-red-color-text: rgb(var(~'@{sd-cssvars-prefix}-red-6'));
-
-@tag-orangered-color-bg: rgb(var(~'@{sd-cssvars-prefix}-orangered-1'));
-@tag-orangered-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-orangered-2'));
-@tag-orangered-color-border: @color-transparent;
-@tag-orangered-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-orangered-6'));
-@tag-orangered-color-border_hover: @color-transparent;
-@tag-orangered-color-icon: rgb(var(~'@{sd-cssvars-prefix}-orangered-6'));
-@tag-orangered-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-orangered-2'));
-@tag-orangered-color-text: rgb(var(~'@{sd-cssvars-prefix}-orangered-6'));
-
-@tag-orange-color-bg: rgb(var(~'@{sd-cssvars-prefix}-orange-1'));
-@tag-orange-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-orange-2'));
-@tag-orange-color-border: @color-transparent;
-@tag-orange-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-orange-6'));
-@tag-orange-color-border_hover: @color-transparent;
-@tag-orange-color-icon: rgb(var(~'@{sd-cssvars-prefix}-orange-6'));
-@tag-orange-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-orange-2'));
-@tag-orange-color-text: rgb(var(~'@{sd-cssvars-prefix}-orange-6'));
-
-@tag-gold-color-bg: rgb(var(~'@{sd-cssvars-prefix}-gold-1'));
-@tag-gold-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-gold-3'));
-@tag-gold-color-border: @color-transparent;
-@tag-gold-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-gold-6'));
-@tag-gold-color-border_hover: @color-transparent;
-@tag-gold-color-icon: rgb(var(~'@{sd-cssvars-prefix}-gold-6'));
-@tag-gold-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-gold-2'));
-@tag-gold-color-text: rgb(var(~'@{sd-cssvars-prefix}-gold-6'));
-
-@tag-lime-color-bg: rgb(var(~'@{sd-cssvars-prefix}-lime-1'));
-@tag-lime-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-lime-2'));
-@tag-lime-color-border: @color-transparent;
-@tag-lime-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-lime-6'));
-@tag-lime-color-border_hover: @color-transparent;
-@tag-lime-color-icon: rgb(var(~'@{sd-cssvars-prefix}-lime-6'));
-@tag-lime-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-lime-2'));
-@tag-lime-color-text: rgb(var(~'@{sd-cssvars-prefix}-lime-6'));
-
-@tag-green-color-bg: rgb(var(~'@{sd-cssvars-prefix}-green-1'));
-@tag-green-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-green-2'));
-@tag-green-color-border: @color-transparent;
-@tag-green-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-green-6'));
-@tag-green-color-border_hover: @color-transparent;
-@tag-green-color-icon: rgb(var(~'@{sd-cssvars-prefix}-green-6'));
-@tag-green-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-green-2'));
-@tag-green-color-text: rgb(var(~'@{sd-cssvars-prefix}-green-6'));
-
-@tag-cyan-color-bg: rgb(var(~'@{sd-cssvars-prefix}-cyan-1'));
-@tag-cyan-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-cyan-2'));
-@tag-cyan-color-border: @color-transparent;
-@tag-cyan-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-cyan-6'));
-@tag-cyan-color-border_hover: @color-transparent;
-@tag-cyan-color-icon: rgb(var(~'@{sd-cssvars-prefix}-cyan-6'));
-@tag-cyan-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-cyan-2'));
-@tag-cyan-color-text: rgb(var(~'@{sd-cssvars-prefix}-cyan-6'));
-
-@tag-blue-color-bg: rgb(var(~'@{sd-cssvars-prefix}-blue-1'));
-@tag-blue-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-blue-2'));
-@tag-blue-color-border: @color-transparent;
-@tag-blue-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-blue-6'));
-@tag-blue-color-border_hover: @color-transparent;
-@tag-blue-color-icon: rgb(var(~'@{sd-cssvars-prefix}-blue-6'));
-@tag-blue-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-blue-2'));
-@tag-blue-color-text: rgb(var(~'@{sd-cssvars-prefix}-blue-6'));
-
-@tag-sdblue-color-bg: rgb(var(~'@{sd-cssvars-prefix}-sdblue-1'));
-@tag-sdblue-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-sdblue-2'));
-@tag-sdblue-color-border: @color-transparent;
-@tag-sdblue-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-sdblue-6'));
-@tag-sdblue-color-border_hover: @color-transparent;
-@tag-sdblue-color-icon: rgb(var(~'@{sd-cssvars-prefix}-sdblue-6'));
-@tag-sdblue-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-sdblue-2'));
-@tag-sdblue-color-text: rgb(var(~'@{sd-cssvars-prefix}-sdblue-6'));
-
-@tag-purple-color-bg: rgb(var(~'@{sd-cssvars-prefix}-purple-1'));
-@tag-purple-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-purple-2'));
-@tag-purple-color-border: @color-transparent;
-@tag-purple-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-purple-6'));
-@tag-purple-color-border_hover: @color-transparent;
-@tag-purple-color-icon: rgb(var(~'@{sd-cssvars-prefix}-purple-6'));
-@tag-purple-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-purple-2'));
-@tag-purple-color-text: rgb(var(~'@{sd-cssvars-prefix}-purple-6'));
-
-@tag-pinkpurple-color-bg: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-1'));
-@tag-pinkpurple-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-2'));
-@tag-pinkpurple-color-border: @color-transparent;
-@tag-pinkpurple-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-6'));
-@tag-pinkpurple-color-border_hover: @color-transparent;
-@tag-pinkpurple-color-icon: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-6'));
-@tag-pinkpurple-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-2'));
-@tag-pinkpurple-color-text: rgb(var(~'@{sd-cssvars-prefix}-pinkpurple-6'));
-
-@tag-magenta-color-bg: rgb(var(~'@{sd-cssvars-prefix}-magenta-1'));
-@tag-magenta-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-magenta-2'));
-@tag-magenta-color-border: @color-transparent;
-@tag-magenta-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-magenta-6'));
-@tag-magenta-color-border_hover: @color-transparent;
-@tag-magenta-color-icon: rgb(var(~'@{sd-cssvars-prefix}-magenta-6'));
-@tag-magenta-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-magenta-2'));
-@tag-magenta-color-text: rgb(var(~'@{sd-cssvars-prefix}-magenta-6'));
-
-@tag-gray-color-bg: rgb(var(~'@{sd-cssvars-prefix}-gray-2'));
-@tag-gray-color-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-gray-3'));
-@tag-gray-color-border: @color-transparent;
-@tag-gray-bordered-color-border: rgb(var(~'@{sd-cssvars-prefix}-gray-6'));
-@tag-gray-color-border_hover: @color-transparent;
-@tag-gray-color-icon: rgb(var(~'@{sd-cssvars-prefix}-gray-6'));
-@tag-gray-color-icon-bg_hover: rgb(var(~'@{sd-cssvars-prefix}-gray-3'));
-@tag-gray-color-text: rgb(var(~'@{sd-cssvars-prefix}-gray-6'));
-
-// vue overwrite token
-@tag-size-medium: @tag-size-default;
-@tag-size-medium-font-size: @tag-size-default-font-size;

package/es/textarea/style/index.less

@@ -1,64 +0,0 @@
-@import url('../../input/style/token.less');
-@import url('../../input/style/input.less');
-
-@textarea-prefix-cls: ~'@{prefix}-textarea';
-
-.@{textarea-prefix-cls}-wrapper {
-  .input-wrapper-style(@textarea-prefix-cls);
-
-  position: relative;
-  display: inline-block;
-  width: 100%;
-  padding-right: 0;
-  padding-left: 0;
-  overflow: hidden;
-
-  .@{textarea-prefix-cls}-word-limit {
-    position: absolute;
-    right: @textarea-layout-tip-right;
-    bottom: @textarea-layout-tip-bottom;
-    color: @textarea-color-tip-text;
-    font-size: @textarea-font-tip-size;
-    user-select: none;
-  }
-
-  &.@{textarea-prefix-cls}-scroll .@{textarea-prefix-cls}-word-limit {
-    right: @textarea-layout-tip-right + 15px;
-  }
-
-  .@{textarea-prefix-cls}-clear-btn {
-    position: absolute;
-    top: 50%;
-    right: @textarea-layout-tip-right;
-    transform: translateY(-50%);
-  }
-
-  &.@{textarea-prefix-cls}-scroll .@{textarea-prefix-cls}-clear-btn {
-    right: @textarea-layout-tip-right + 15px;
-  }
-
-  &:hover {
-    .@{textarea-prefix-cls}-clear-btn {
-      display: block;
-    }
-  }
-
-  .@{textarea-prefix-cls}-mirror {
-    position: absolute;
-    visibility: hidden;
-  }
-}
-
-.@{textarea-prefix-cls} {
-  .input-style();
-
-  display: block;
-  box-sizing: border-box;
-  height: 100%;
-  min-height: @textarea-size-min-height;
-  padding: @textarea-padding-vertical @textarea-padding-horizontal;
-  font-size: @textarea-font-size;
-  line-height: @line-height-base;
-  vertical-align: top;
-  resize: vertical;
-}

package/es/time-picker/style/index.less

@@ -1,93 +0,0 @@
-@import url('./token.less');
-
-@time-picker-prefix-cls: ~'@{prefix}-timepicker';
-
-.@{time-picker-prefix-cls} {
-  position: relative;
-  display: flex;
-  box-sizing: border-box;
-  padding: 0;
-
-  &-container {
-    overflow: hidden;
-    background-color: var(~'@{sd-cssvars-prefix}-color-bg-popup');
-    border: 1px solid @timepicker-color-border;
-    border-radius: @timepicker-wrapper-border-radius;
-    box-shadow: @popup-box-shadow-base;
-  }
-
-  &-column {
-    box-sizing: border-box;
-    width: @timepicker-column-width;
-    height: @timepicker-column-height;
-    overflow: hidden;
-
-    &:not(:last-child) {
-      border-right: 1px solid @timepicker-color-border;
-    }
-
-    &:hover {
-      overflow-y: auto;
-    }
-
-    ul {
-      box-sizing: border-box;
-      margin: 0;
-      padding: 0;
-      list-style: none;
-
-      &::after {
-        display: block;
-        width: 100%;
-        height: @timepicker-column-height - @timepicker-cell-height - @timepicker-cell-spacing * 2;
-        content: '';
-      }
-    }
-  }
-
-  &-cell {
-    padding: @timepicker-cell-spacing 0;
-    color: @timepicker-color-text-cell;
-    font-weight: @timepicker-font-weight-cell;
-    cursor: pointer;
-
-    &-inner {
-      height: @timepicker-cell-height;
-      padding-left: 24px;
-      font-size: 14px;
-      line-height: @timepicker-cell-height;
-    }
-
-    &:not(&-selected, &-disabled):hover &-inner {
-      background-color: @timepicker-color-bg-cell_hover;
-    }
-  }
-
-  &-cell-selected &-cell-inner {
-    font-weight: @timepicker-font-weight-cell_active;
-    background-color: @timepicker-color-bg-cell_active;
-  }
-
-  &-cell-disabled {
-    color: @timepicker-color-text-cell_disabled;
-    cursor: not-allowed;
-  }
-
-  &-footer-extra-wrapper {
-    padding: 8px;
-    color: var(~'@{sd-cssvars-prefix}-color-text-1');
-    font-size: @font-size-body-1;
-    border-top: 1px solid @timepicker-color-border;
-  }
-
-  &-footer-btn-wrapper {
-    display: flex;
-    justify-content: space-between;
-    padding: 8px;
-    border-top: 1px solid @timepicker-color-border;
-
-    & :only-child {
-      margin-left: auto;
-    }
-  }
-}

package/es/time-picker/style/token.less

@@ -1,25 +0,0 @@
-@import url('../../style/theme/index.less');
-
-@timepicker-wrapper-border-radius: @radius-medium;
-
-@timepicker-column-width: 64px;
-
-@timepicker-column-height: 224px;
-
-@timepicker-cell-height: 24px;
-
-@timepicker-cell-spacing: 4px;
-
-@timepicker-color-border: var(~'@{sd-cssvars-prefix}-color-neutral-3');
-
-@timepicker-color-text-cell: var(~'@{sd-cssvars-prefix}-color-text-1');
-
-@timepicker-color-bg-cell_hover: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@timepicker-color-bg-cell_active: var(~'@{sd-cssvars-prefix}-color-fill-2');
-
-@timepicker-color-text-cell_disabled: var(~'@{sd-cssvars-prefix}-color-text-4');
-
-@timepicker-font-weight-cell: @font-weight-500;
-
-@timepicker-font-weight-cell_active: @font-weight-500;

package/es/timeline/style/horizontal.less

@@ -1,87 +0,0 @@
-.@{timeline-prefix-cls}-direction-horizontal {
-  display: flex;
-  flex-direction: row;
-
-  &.@{timeline-prefix-cls}-is-reverse {
-    flex-direction: row-reverse;
-  }
-}
-
-.@{timeline-prefix-cls}-item-dot-line-is-horizontal {
-  top: 50%;
-  right: @timeline-horizontal-margin-line-right;
-  left: @timeline-dot-size-width + @timeline-horizontal-margin-line-left;
-  width: unset;
-  height: @timeline-size-line-width;
-  border-top-width: @timeline-size-line-width;
-  border-left: none;
-  transform: translateY(-50%);
-}
-
-.@{timeline-prefix-cls}-item-horizontal-bottom,
-.@{timeline-prefix-cls}-item-horizontal-top {
-  flex: 1;
-  min-height: unset;
-  padding-right: 0;
-  padding-left: 0;
-
-  > .@{timeline-prefix-cls}-item-dot-wrapper {
-    top: 0;
-    width: 100%;
-    height: auto;
-
-    .@{timeline-prefix-cls}-item-dot {
-      top: unset;
-      margin-top: unset;
-    }
-
-    .@{timeline-prefix-cls}-item-dot-content {
-      height: 6px;
-      line-height: 6px;
-    }
-  }
-}
-
-.@{timeline-prefix-cls}-item-horizontal-top {
-  padding-top: @timeline-dot-size-width;
-
-  > .@{timeline-prefix-cls}-item-dot-wrapper {
-    top: 0;
-    bottom: unset;
-  }
-
-  > .@{timeline-prefix-cls}-item-content-wrapper {
-    margin-top: @timeline-horizontal-margin-content-spacing;
-    margin-left: 0;
-  }
-}
-
-.@{timeline-prefix-cls}-item-horizontal-bottom {
-  padding-bottom: @timeline-dot-size-width;
-
-  > .@{timeline-prefix-cls}-item-dot-wrapper {
-    top: unset;
-    bottom: 0;
-  }
-
-  > .@{timeline-prefix-cls}-item-content-wrapper {
-    margin-bottom: @timeline-horizontal-margin-content-spacing;
-    margin-left: 0;
-  }
-}
-
-.@{timeline-prefix-cls}-alternate.@{timeline-prefix-cls}-direction-horizontal {
-  align-items: center;
-  min-height: 200px;
-  overflow: visible;
-
-  .@{timeline-prefix-cls}-item-horizontal-bottom {
-    margin-top: @timeline-dot-size-width;
-    transform: translateY(-50%);
-  }
-
-  .@{timeline-prefix-cls}-item-horizontal-top {
-    margin-top: -@timeline-dot-size-width;
-    transform: translateY(50%);
-  }
-}

package/es/timeline/style/index.less

@@ -1,271 +0,0 @@
-@import url('./token.less');
-
-@timeline-prefix-cls: ~'@{prefix}-timeline';
-@timeline-item-prefix-cls: ~'@{prefix}-timeline-item';
-
-.@{timeline-prefix-cls} {
-  display: flex;
-  flex-direction: column;
-
-  &-item {
-    position: relative;
-    min-height: @timeline-item-min-height;
-    padding-left: @timeline-dot-size-width;
-    color: @timeline-color-content-text;
-    font-size: @timeline-font-content-size;
-
-    &-label {
-      color: @timeline-color-label-text;
-      font-size: @timeline-font-label-size;
-      line-height: 1.667;
-    }
-
-    &-content {
-      margin-bottom: @timeline-vertical-margin-content-bottom;
-      color: @timeline-color-content-text;
-      font-size: @timeline-font-content-size;
-      line-height: 1.5715;
-
-      &-wrapper {
-        position: relative;
-        margin-left: @timeline-vertical-margin-content-left;
-      }
-    }
-  }
-}
-
-// 节点的样式
-.@{timeline-prefix-cls}-item {
-  &&-last {
-    > .@{timeline-prefix-cls}-item-dot-wrapper .@{timeline-prefix-cls}-item-dot-line {
-      display: none;
-    }
-  }
-
-  &-dot-wrapper {
-    position: absolute;
-    left: 0;
-    height: 100%;
-    text-align: center;
-
-    .@{timeline-prefix-cls}-item-dot-content {
-      position: relative;
-      width: @timeline-dot-size-width;
-      height: 1.5715 * @timeline-font-content-size;
-      line-height: $height;
-    }
-  }
-
-  &-dot {
-    position: relative;
-    top: 50%;
-    box-sizing: border-box;
-    width: @timeline-dot-size-width;
-    height: @timeline-dot-size-width;
-    margin-top: -50%;
-    color: @timeline-color-dot-bg;
-    border-radius: @timeline-dot-border-radius;
-
-    &-solid {
-      background-color: @timeline-color-dot-bg;
-    }
-
-    &-hollow {
-      background-color: @timeline-color-dot-bg_hollow;
-      border: @timeline-dot-border-width_hollow solid @timeline-color-dot-bg;
-    }
-
-    &-custom {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      display: inline-flex;
-      box-sizing: border-box;
-      color: @timeline-color-dot-bg;
-      background-color: var(~'@{sd-cssvars-prefix}-color-bg-2');
-      transform: translateX(-50%) translateY(-50%);
-      transform-origin: center;
-
-      svg {
-        color: inherit;
-      }
-    }
-  }
-
-  &-dot-line {
-    // bottom: -7px;
-    position: absolute;
-    top: 1.5715 * (@timeline-font-content-size / 2) + (@timeline-dot-size-width / 2) +
-      @timeline-vertical-margin-line-top;
-    bottom: -(
-        1.5715 * (@timeline-font-content-size / 2) - (@timeline-dot-size-width / 2) -
-          @timeline-vertical-margin-line-bottom
-      );
-    left: 50%;
-    box-sizing: border-box;
-    width: @timeline-size-line-width;
-    border-color: @timeline-color-line-bg;
-    border-left-width: @timeline-size-line-width;
-    transform: translateX(-50%);
-  }
-}
-
-/* reverse  */
-.@{timeline-prefix-cls} {
-  &-is-reverse {
-    flex-direction: column-reverse;
-  }
-}
-
-/* mode  */
-.@{timeline-prefix-cls} {
-  &-alternate {
-    overflow: hidden;
-
-    .@{timeline-item-prefix-cls}-vertical-left {
-      padding-left: 0;
-
-      > .@{timeline-item-prefix-cls}-dot-wrapper {
-        left: 50%;
-      }
-
-      > .@{timeline-item-prefix-cls}-content-wrapper {
-        left: 50%;
-        width: 50%;
-        margin-left: @timeline-vertical-margin-content-left + @timeline-dot-size-width;
-        padding-right: @timeline-vertical-margin-content-left + @timeline-dot-size-width;
-      }
-    }
-
-    .@{timeline-item-prefix-cls}-vertical-right {
-      padding-right: 0;
-
-      > .@{timeline-item-prefix-cls}-dot-wrapper {
-        left: 50%;
-      }
-
-      > .@{timeline-item-prefix-cls}-content-wrapper {
-        left: 0;
-        width: 50%;
-        margin-right: 0;
-        margin-left: -@timeline-vertical-margin-content-left;
-        padding-right: @timeline-vertical-margin-content-left;
-        text-align: right;
-      }
-    }
-  }
-
-  &-right {
-    .@{timeline-item-prefix-cls}-vertical-right {
-      padding-right: @timeline-dot-size-width;
-
-      > .@{timeline-item-prefix-cls}-dot-wrapper {
-        right: 0;
-        left: unset;
-      }
-
-      > .@{timeline-item-prefix-cls}-content-wrapper {
-        margin-right: @timeline-vertical-margin-content-left;
-        margin-left: 0;
-        text-align: right;
-      }
-    }
-  }
-}
-
-/* label position */
-.@{timeline-prefix-cls}-item {
-  &-label-relative {
-    > .@{timeline-prefix-cls}-item-label {
-      position: absolute;
-      top: 0;
-      box-sizing: border-box;
-      max-width: 100px;
-    }
-  }
-
-  &-vertical-left&-label-relative {
-    margin-left: 100px;
-
-    > .@{timeline-prefix-cls}-item-label {
-      left: 0;
-      padding-right: @timeline-vertical-margin-content-left;
-      text-align: right;
-      transform: translateX(-100%);
-    }
-  }
-
-  &-vertical-right&-label-relative {
-    margin-right: 100px;
-
-    > .@{timeline-prefix-cls}-item-label {
-      right: 0;
-      padding-left: @timeline-vertical-margin-content-left;
-      text-align: left;
-      transform: translateX(100%);
-    }
-  }
-
-  &-horizontal-top&-label-relative {
-    margin-top: 50px;
-
-    > .@{timeline-prefix-cls}-item-label {
-      padding-bottom: @timeline-horizontal-margin-content-spacing;
-      transform: translateY(-100%);
-    }
-
-    > .@{timeline-prefix-cls}-item-content {
-      margin-bottom: 0;
-    }
-  }
-
-  &-horizontal-bottom&-label-relative {
-    margin-bottom: 50px;
-
-    > .@{timeline-prefix-cls}-item-content {
-      margin-bottom: 0;
-    }
-
-    > .@{timeline-prefix-cls}-item-label {
-      top: unset;
-      bottom: 0;
-      padding-top: @timeline-horizontal-margin-content-spacing;
-      text-align: left;
-      transform: translateY(100%);
-    }
-  }
-}
-
-.@{timeline-prefix-cls}-alternate {
-  .@{timeline-prefix-cls}-item-vertical-left.@{timeline-prefix-cls}-item-label-relative {
-    margin-left: 0;
-
-    > .@{timeline-prefix-cls}-item-label {
-      left: 0;
-      width: 50%;
-      max-width: unset;
-      transform: none;
-    }
-  }
-
-  .@{timeline-prefix-cls}-item-vertical-right.@{timeline-prefix-cls}-item-label-relative {
-    margin-right: 0;
-
-    > .@{timeline-prefix-cls}-item-label {
-      right: 0;
-      width: 50%;
-      max-width: unset;
-      transform: none;
-    }
-  }
-
-  .@{timeline-prefix-cls}-item-horizontal-top.@{timeline-prefix-cls}-item-label-relative {
-    margin-top: 0;
-  }
-
-  .@{timeline-prefix-cls}-item-horizontal-bottom.@{timeline-prefix-cls}-item-label-relative {
-    margin-bottom: 0;
-  }
-}
-
-@import url('./horizontal.less');