vft 0.0.71 → 0.0.73

package/theme-style/src/upload.scss

@@ -0,0 +1,621 @@
+@use 'mixins/mixins' as *;
+@use 'common/var' as *;
+
+@mixin upload-success($color: null) {
+  right: -15px;
+  top: -6px;
+  width: 40px;
+  height: 24px;
+  background: getCssVar('success-color');
+  text-align: center;
+  transform: rotate(45deg);
+
+  i {
+    font-size: 12px;
+    margin-top: 11px;
+    transform: rotate(-45deg);
+    color: $color;
+  }
+}
+
+@include b(upload) {
+  @include set-component-css-var('upload', $upload);
+}
+
+@include b(upload) {
+  @include flex-center(true);
+
+  cursor: pointer;
+  outline: none;
+  @include e(input) {
+    display: none;
+  }
+
+  @include e(tip) {
+    font-size: 12px;
+    color: getCssVar('text-color', 'regular');
+    margin-top: 7px;
+  }
+
+  iframe {
+    position: absolute;
+    z-index: -1;
+    top: 0;
+    left: 0;
+    opacity: 0;
+    filter: alpha(opacity=0);
+  }
+
+  /* Picture Card for Wall */
+  @include m(picture-card) {
+    @include set-css-var-value(('upload', 'picture-card', 'size'), 148px);
+
+    background-color: getCssVar('fill-color', 'lighter');
+    border: 1px dashed getCssVar('border-color', 'darker');
+    border-radius: 6px;
+    box-sizing: border-box;
+    width: getCssVar('upload', 'picture-card', 'size');
+    height: getCssVar('upload', 'picture-card', 'size');
+    cursor: pointer;
+    vertical-align: top;
+
+    @include flex-center(true);
+
+    i {
+      font-size: 28px;
+      color: getCssVar('text-color', 'secondary');
+    }
+
+    &:hover {
+      border-color: getCssVar('primary-color');
+      color: getCssVar('primary-color');
+    }
+  }
+
+  @include when(drag) {
+    display: block;
+  }
+
+  &:focus {
+    border-color: getCssVar('primary-color');
+    color: getCssVar('primary-color');
+
+    .#{$namespace}-upload-dragger {
+      border-color: getCssVar('primary-color');
+    }
+  }
+}
+
+@include b(upload-dragger) {
+  padding: getCssVar('upload-dragger-padding-horizontal')
+    getCssVar('upload-dragger-padding-vertical');
+  background-color: getCssVar('fill-color', 'blank');
+  border: 1px dashed getCssVar('border-color');
+  border-radius: 6px;
+  box-sizing: border-box;
+  text-align: center;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+
+  .#{bem('icon', '', 'upload')} {
+    font-size: 67px;
+    color: getCssVar('text-color', 'placeholder');
+    margin-bottom: 16px;
+    line-height: 50px;
+  }
+
+  + .#{bem('upload', 'tip')} {
+    text-align: center;
+  }
+
+  ~ .#{bem('upload', 'files')} {
+    border-top: getCssVar('border');
+    margin-top: 7px;
+    padding-top: 5px;
+  }
+
+  .#{bem('upload', 'text')} {
+    color: getCssVar('text-color', 'regular');
+    font-size: 14px;
+    text-align: center;
+
+    em {
+      color: getCssVar('primary-color');
+      font-style: normal;
+    }
+  }
+
+  &:hover {
+    border-color: getCssVar('primary-color');
+  }
+
+  @include when(dragover) {
+    padding: calc(#{getCssVar('upload-dragger-padding-horizontal')} - 1px)
+      calc(#{getCssVar('upload-dragger-padding-vertical')} - 1px);
+    background-color: getCssVar('color', 'primary', 'light-9');
+    border: 2px dashed getCssVar('primary-color');
+  }
+}
+
+@include b(upload-list) {
+  margin: 10px 0 0;
+  padding: 0;
+  list-style: none;
+  position: relative;
+  @include e(item) {
+    transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
+    font-size: 14px;
+    color: getCssVar('text-color', 'regular');
+    margin-bottom: 5px;
+    position: relative;
+    box-sizing: border-box;
+    border-radius: 4px;
+    width: 100%;
+
+    .#{bem('progress')} {
+      position: absolute;
+      top: 20px;
+      width: 100%;
+    }
+
+    .#{bem('progress', 'text')} {
+      position: absolute;
+      right: 0;
+      top: -13px;
+    }
+
+    .#{bem('progress-bar')} {
+      margin-right: 0;
+      padding-right: 0;
+    }
+
+    & .#{bem('icon', '', 'upload-success')} {
+      color: getCssVar('success-color');
+    }
+
+    .#{bem('icon', '', 'close')} {
+      display: none;
+      position: absolute;
+      right: 5px;
+      top: 50%;
+      cursor: pointer;
+      opacity: 0.75;
+      color: getCssVar('text-color', 'regular');
+      transition: opacity getCssVar('transition-duration');
+      transform: translateY(-50%);
+
+      &:hover {
+        opacity: 1;
+        color: getCssVar('primary-color');
+      }
+    }
+
+    & .#{bem('icon', '', 'close-tip')} {
+      display: none;
+      position: absolute;
+      top: 1px;
+      right: 5px;
+      font-size: 12px;
+      cursor: pointer;
+      opacity: 1;
+      color: getCssVar('primary-color');
+      font-style: normal;
+    }
+
+    &:hover {
+      background-color: getCssVar('fill-color', 'light');
+
+      .#{bem('icon', '', 'close')} {
+        display: inline-flex;
+      }
+
+      .#{bem('progress', 'text')} {
+        display: none;
+      }
+    }
+
+    .#{bem('upload-list', 'item-info')} {
+      display: inline-flex;
+      justify-content: center;
+      flex-direction: column;
+      width: calc(100% - 30px);
+      margin-left: 4px;
+    }
+
+    @include when(success) {
+      .#{bem('upload-list', 'item-status-label')} {
+        display: inline-flex;
+      }
+
+      .#{bem('upload-list', 'item-name')}:hover,
+      .#{bem('upload-list', 'item-name')}:focus {
+        color: getCssVar('primary-color');
+        cursor: pointer;
+      }
+
+      &:focus:not(:hover) {
+        /* 键盘focus */
+        .#{bem('icon', '', 'close-tip')} {
+          display: inline-block;
+        }
+      }
+
+      &:not(.focusing):focus,
+      &:active {
+        /* click时 */
+        outline-width: 0;
+        .#{bem('icon', '', 'close-tip')} {
+          display: none;
+        }
+      }
+
+      &:hover,
+      &:focus {
+        .#{bem('upload-list', 'item-status-label')} {
+          display: none;
+          opacity: 0;
+        }
+      }
+    }
+  }
+
+  @include e(item-name) {
+    color: getCssVar('text-color', 'regular');
+    display: inline-flex;
+    text-align: center;
+    align-items: center;
+
+    padding: 0 4px;
+
+    transition: color getCssVar('transition-duration');
+    font-size: getCssVar('font-size', 'base');
+
+    .#{$namespace}-icon {
+      margin-right: 6px;
+      color: getCssVar('text-color', 'secondary');
+    }
+  }
+
+  @include e(item-file-name) {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  @include e(item-status-label) {
+    position: absolute;
+    right: 5px;
+    top: 0;
+    line-height: inherit;
+    display: none;
+
+    height: 100%;
+    justify-content: center;
+    align-items: center;
+
+    transition: opacity getCssVar('transition-duration');
+  }
+
+  @include e(item-delete) {
+    position: absolute;
+    right: 10px;
+    top: 0;
+    font-size: 12px;
+    color: getCssVar('text-color', 'regular');
+    display: none;
+
+    &:hover {
+      color: getCssVar('primary-color');
+    }
+  }
+
+  // upload-list
+  @include m(picture-card) {
+    @include set-css-var-value(('upload-list', 'picture-card', 'size'), 148px);
+
+    display: inline-flex;
+    flex-wrap: wrap;
+    margin: 0;
+
+    .#{bem('upload-list', 'item')} {
+      overflow: hidden;
+      background-color: getCssVar('fill-color', 'blank');
+      border: 1px solid getCssVar('border-color');
+      border-radius: 6px;
+      box-sizing: border-box;
+      width: getCssVar('upload-list', 'picture-card', 'size');
+      height: getCssVar('upload-list', 'picture-card', 'size');
+      margin: 0 8px 8px 0;
+      padding: 0;
+
+      display: inline-flex;
+
+      .#{bem('icon', '' ,'check')},
+      .#{bem('icon', '' ,'circle-check')} {
+        color: $color-white;
+      }
+
+      .#{bem('icon', '', 'close')} {
+        display: none;
+      }
+      &:hover {
+        .#{bem('upload-list', 'item-status-label')} {
+          opacity: 0;
+          // for fade out
+          display: block;
+        }
+
+        .#{$namespace}-progress__text {
+          display: block;
+        }
+      }
+    }
+
+    .#{bem('upload-list', 'item')} {
+      .#{bem('upload-list', 'item-name')} {
+        display: none;
+      }
+    }
+
+    .#{bem('upload-list', 'item-thumbnail')} {
+      width: 100%;
+      height: 100%;
+      object-fit: contain;
+    }
+
+    .#{bem('upload-list', 'item-status-label')} {
+      @include upload-success();
+    }
+
+    .#{bem('upload-list', 'item-actions')} {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      left: 0;
+      top: 0;
+      cursor: default;
+
+      display: inline-flex;
+      justify-content: center;
+      align-items: center;
+
+      color: #fff;
+      opacity: 0;
+      font-size: 20px;
+      background-color: getCssVar('overlay-color', 'lighter');
+      transition: opacity getCssVar('transition-duration');
+
+      span {
+        display: none;
+        cursor: pointer;
+      }
+
+      span + span {
+        margin-left: 1rem;
+      }
+
+      .#{bem('upload-list', 'item-delete')} {
+        position: static;
+        font-size: inherit;
+        color: inherit;
+      }
+
+      &:hover {
+        opacity: 1;
+        span {
+          display: inline-flex;
+        }
+      }
+    }
+
+    .#{bem('progress')} {
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      bottom: auto;
+      width: 126px;
+
+      .#{$namespace}-progress__text {
+        top: 50%;
+      }
+    }
+  }
+
+  @include m(picture) {
+    .#{bem('upload-list', 'item')} {
+      overflow: hidden;
+      z-index: 0;
+      background-color: getCssVar('fill-color', 'blank');
+      border: 1px solid getCssVar('border-color');
+      border-radius: 6px;
+      box-sizing: border-box;
+      margin-top: 10px;
+      padding: 10px;
+      display: flex;
+      align-items: center;
+
+      .#{bem('icon', '' ,'check')},
+      .#{bem('icon', '' ,'circle-check')} {
+        color: $color-white;
+      }
+
+      &:hover {
+        .#{bem('upload-list', 'item-status-label')} {
+          opacity: 0;
+          display: inline-flex;
+        }
+
+        .#{bem('progress', 'text')} {
+          display: block;
+        }
+      }
+
+      &.is-success {
+        .#{bem('upload-list', 'item-name')} {
+          i {
+            display: none;
+          }
+        }
+      }
+
+      & .#{bem('icon', '' ,'close')} {
+        top: 5px;
+        transform: translateY(0);
+      }
+    }
+
+    .#{bem('upload-list', 'item-thumbnail')} {
+      $item-thumbnail-size: 70px;
+
+      display: inline-flex;
+      justify-content: center;
+      align-items: center;
+
+      width: $item-thumbnail-size;
+      height: $item-thumbnail-size;
+      object-fit: contain;
+
+      position: relative;
+      z-index: 1;
+      background-color: getCssVar('color-white');
+    }
+
+    .#{bem('upload-list', 'item-status-label')} {
+      position: absolute;
+      right: -17px;
+      top: -7px;
+      width: 46px;
+      height: 26px;
+      background: getCssVar('success-color');
+      text-align: center;
+      transform: rotate(45deg);
+
+      i {
+        font-size: 12px;
+        margin-top: 12px;
+        transform: rotate(-45deg);
+      }
+    }
+
+    .#{$namespace}-progress {
+      position: relative;
+      top: -7px;
+    }
+  }
+}
+
+@include b(upload-cover) {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  z-index: 10;
+  cursor: default;
+  @include utils-vertical-center;
+
+  img {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
+
+  @include e(label) {
+    @include upload-success(#fff);
+  }
+
+  @include e(progress) {
+    display: inline-block;
+    vertical-align: middle;
+    position: static;
+    width: 243px;
+
+    + .#{bem('upload', 'inner')} {
+      opacity: 0;
+    }
+  }
+
+  @include e(content) {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+
+  @include e(interact) {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: getCssVar('overlay-color', 'light');
+    text-align: center;
+
+    .btn {
+      display: inline-block;
+      color: $color-white;
+      font-size: 14px;
+      cursor: pointer;
+      vertical-align: middle;
+      transition: getCssVar('transition-md-fade');
+      margin-top: 60px;
+
+      i {
+        margin-top: 0;
+      }
+
+      span {
+        opacity: 0;
+        transition: opacity 0.15s linear;
+      }
+
+      &:not(:first-child) {
+        margin-left: 35px;
+      }
+
+      &:hover {
+        transform: translateY(-13px);
+
+        span {
+          opacity: 1;
+        }
+      }
+
+      i {
+        color: $color-white;
+        display: block;
+        font-size: 24px;
+        line-height: inherit;
+        margin: 0 auto 5px;
+      }
+    }
+  }
+
+  @include e(title) {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    background-color: $color-white;
+    height: 36px;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    font-weight: normal;
+    text-align: left;
+    padding: 0 10px;
+    margin: 0;
+    line-height: 36px;
+    font-size: 14px;
+    color: getCssVar('text-color', 'primary');
+  }
+
+  + .#{bem('upload', 'inner')} {
+    opacity: 0;
+    position: relative;
+    z-index: 1;
+  }
+}

package/theme-style/vft-affix.css

@@ -0,0 +1 @@
+.vft-affix--fixed{position:fixed}

package/theme-style/vft-aside.css

@@ -0,0 +1 @@
+.vft-aside{overflow:auto;box-sizing:border-box;flex-shrink:0;width:var(--vft-aside-width,300px)}

package/theme-style/vft-autocomplete.css

@@ -0,0 +1 @@
+.vft-autocomplete{position:relative;display:inline-block}.vft-autocomplete__popper.vft-popper{background:var(--vft-bg-color-overlay);border:1px solid var(--vft-border-color-light);box-shadow:var(--vft-box-shadow-light)}.vft-autocomplete__popper.vft-popper .vft-popper__arrow::before{border:1px solid var(--vft-border-color-light)}.vft-autocomplete__popper.vft-popper[data-popper-placement^=top] .vft-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.vft-autocomplete__popper.vft-popper[data-popper-placement^=bottom] .vft-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.vft-autocomplete__popper.vft-popper[data-popper-placement^=left] .vft-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.vft-autocomplete__popper.vft-popper[data-popper-placement^=right] .vft-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.vft-autocomplete-suggestion{border-radius:var(--vft-border-radius-base);box-sizing:border-box}.vft-autocomplete-suggestion__wrap{max-height:280px;padding:10px 0;box-sizing:border-box}.vft-autocomplete-suggestion__list{margin:0;padding:0}.vft-autocomplete-suggestion li{padding:0 20px;margin:0;line-height:34px;cursor:pointer;color:var(--vft-text-color-regular);font-size:var(--vft-font-size-base);list-style:none;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vft-autocomplete-suggestion li:hover{background-color:var(--vft-fill-color-light)}.vft-autocomplete-suggestion li.highlighted{background-color:var(--vft-fill-color-light)}.vft-autocomplete-suggestion li.divider{margin-top:6px;border-top:1px solid var(--vft-color-black)}.vft-autocomplete-suggestion li.divider:last-child{margin-bottom:-6px}.vft-autocomplete-suggestion.is-loading li{text-align:center;height:100px;line-height:100px;font-size:20px;color:var(--vft-text-color-secondary)}.vft-autocomplete-suggestion.is-loading li::after{display:inline-block;content:"";height:100%;vertical-align:middle}.vft-autocomplete-suggestion.is-loading li:hover{background-color:var(--vft-bg-color-overlay)}.vft-autocomplete-suggestion.is-loading .vft-icon-loading{vertical-align:middle}

package/theme-style/vft-back-top.css

@@ -1 +1 @@
-.vft-back-top{--vft-backtop-bg-color:var(--vft-bg-color-overlay);--vft-backtop-text-color:var(--vft-text-primary-color);--vft-backtop-hover-bg-color:var(--vft-border-color-extra-light);position:fixed;background-color:var(--vft-backtop-bg-color);width:40px;height:40px;border-radius:50%;color:var(--vft-backtop-text-color);display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:var(--vft-box-shadow-lighter);cursor:pointer;z-index:5}.vft-back-top:hover{background-color:var(--vft-backtop-hover-bg-color)}.vft-back-top__icon{font-size:20px}
+.vft-back-top{--vft-backtop-bg-color:var(--vft-bg-color-overlay);--vft-backtop-text-color:var(--vft-text-primary-color);--vft-backtop-hover-bg-color:var(--vft-border-color-extra-light);position:fixed;background-color:var(--vft-back-top-bg-color);width:40px;height:40px;border-radius:50%;color:var(--vft-back-top-text-color);display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:var(--vft-box-shadow-lighter);cursor:pointer;z-index:var(--vft-z-index-back-top)}.vft-back-top:hover{background-color:var(--vft-backtop-hover-bg-color)}.vft-back-top__icon{font-size:20px}

package/theme-style/vft-badge.css

@@ -0,0 +1 @@
+.vft-badge{--vft-badge-bg-color:var(--vft-danger-color);--vft-badge-radius:10px;--vft-badge-font-size:12px;--vft-badge-padding:6px;--vft-badge-size:18px;position:relative;vertical-align:middle;display:inline-block;width:-moz-fit-content;width:fit-content}.vft-badge__content{background-color:var(--vft-badge-bg-color);border-radius:var(--vft-badge-radius);color:var(--vft-color-white);display:inline-flex;justify-content:center;align-items:center;font-size:var(--vft-badge-font-size);height:var(--vft-badge-size);padding:0 var(--vft-badge-padding);white-space:nowrap;border:1px solid var(--vft-bg-color)}.vft-badge__content.is-fixed{position:absolute;top:0;right:calc(1px + var(--vft-badge-size)/ 2);transform:translateY(-50%) translateX(100%);z-index:var(--vft-index-normal)}.vft-badge__content.is-fixed.is-dot{right:5px}.vft-badge__content.is-dot{height:8px;width:8px;padding:0;right:0;border-radius:50%}.vft-badge__content--primary{background-color:var(--vft-color-primary)}.vft-badge__content--success{background-color:var(--vft-color-success)}.vft-badge__content--warning{background-color:var(--vft-color-warning)}.vft-badge__content--info{background-color:var(--vft-color-info)}.vft-badge__content--danger{background-color:var(--vft-color-danger)}

package/theme-style/vft-breadcrumb.css

@@ -0,0 +1 @@
+.vft-breadcrumb{font-size:14px;line-height:1}.vft-breadcrumb::after,.vft-breadcrumb::before{display:table;content:""}.vft-breadcrumb::after{clear:both}.vft-breadcrumb__separator{margin:0 9px;font-weight:700;color:var(--vft-text-color-placeholder)}.vft-breadcrumb__separator.vft-icon{margin:0 6px;font-weight:400}.vft-breadcrumb__separator.vft-icon svg{vertical-align:middle}.vft-breadcrumb__item{float:left;display:inline-flex;align-items:center}.vft-breadcrumb__inner{color:var(--vft-text-color-regular)}.vft-breadcrumb__inner a,.vft-breadcrumb__inner.is-link{font-weight:700;text-decoration:none;transition:var(--vft-transition-color);color:var(--vft-text-color-primary)}.vft-breadcrumb__inner a:hover,.vft-breadcrumb__inner.is-link:hover{color:var(--vft-primary-color);cursor:pointer}.vft-breadcrumb__item:last-child .vft-breadcrumb__inner,.vft-breadcrumb__item:last-child .vft-breadcrumb__inner a,.vft-breadcrumb__item:last-child .vft-breadcrumb__inner a:hover,.vft-breadcrumb__item:last-child .vft-breadcrumb__inner:hover{font-weight:400;color:var(--vft-text-color-regular);cursor:text}.vft-breadcrumb__item:last-child .vft-breadcrumb__separator{display:none}

package/theme-style/vft-calendar.css

@@ -0,0 +1 @@
+.vft-calendar{--vft-calendar-border:var(--vft-table-border, 1px solid var(--vft-border-color-lighter));--vft-calendar-header-border-bottom:var(--vft-calendar-border);--vft-calendar-selected-bg-color:var(--vft-color-primary-light-9);--vft-calendar-cell-width:85px;background-color:var(--vft-fill-color-blank)}.vft-calendar__header{display:flex;justify-content:space-between;padding:12px 20px;border-bottom:var(--vft-calendar-header-border-bottom)}.vft-calendar__title{color:var(--vft-text-color);align-self:center}.vft-calendar__body{padding:12px 20px 35px}.vft-calendar-table{table-layout:fixed;width:100%}.vft-calendar-table thead th{padding:12px 0;color:var(--vft-text-color-regular);font-weight:400}.vft-calendar-table:not(.is-range) td.next,.vft-calendar-table:not(.is-range) td.prev{color:var(--vft-text-color-placeholder)}.vft-calendar-table td{border-bottom:var(--vft-calendar-border);border-right:var(--vft-calendar-border);vertical-align:top;transition:background-color var(--vft-transition-duration-fast) ease}.vft-calendar-table td.is-selected{background-color:var(--vft-calendar-selected-bg-color)}.vft-calendar-table td.is-today{color:var(--vft-primary-color)}.vft-calendar-table tr:first-child td{border-top:var(--vft-calendar-border)}.vft-calendar-table tr td:first-child{border-left:var(--vft-calendar-border)}.vft-calendar-table tr.vft-calendar-table__row--hide-border td{border-top:none}.vft-calendar-table .vft-calendar-day{box-sizing:border-box;padding:8px;height:var(--vft-calendar-cell-width)}.vft-calendar-table .vft-calendar-day:hover{cursor:pointer;background-color:var(--vft-calendar-selected-bg-color)}

package/theme-style/vft-card.css

@@ -0,0 +1 @@
+.vft-card{--vft-card-border-color:var(--vft-border-color-light);--vft-card-border-radius:4px;--vft-card-padding:20px;--vft-card-bg-color:var(--vft-fill-color-blank)}.vft-card{border-radius:var(--vft-card-border-radius);border:1px solid var(--vft-card-border-color);background-color:var(--vft-card-bg-color);overflow:hidden;color:var(--vft-text-color-primary);transition:var(--vft-transition-duration)}.vft-card.is-always-shadow{box-shadow:var(--vft-box-shadow-light)}.vft-card.is-hover-shadow:focus,.vft-card.is-hover-shadow:hover{box-shadow:var(--vft-box-shadow-light)}.vft-card__header{padding:calc(var(--vft-card-padding) - 2px) var(--vft-card-padding);border-bottom:1px solid var(--vft-card-border-color);box-sizing:border-box}.vft-card__body{padding:var(--vft-card-padding)}

package/theme-style/vft-carousel-item.css

@@ -0,0 +1 @@
+.vft-carousel__item{position:absolute;top:0;left:0;width:100%;height:100%;display:inline-block;overflow:hidden;z-index:calc(var(--vft-index-normal) - 1)}.vft-carousel__item.is-active{z-index:calc(var(--vft-index-normal) - 1)}.vft-carousel__item.is-animating{transition:transform .4s ease-in-out}.vft-carousel__item--card{width:50%;transition:transform .4s ease-in-out}.vft-carousel__item--card.is-in-stage{cursor:pointer;z-index:var(--vft-index-normal)}.vft-carousel__item--card.is-in-stage.is-hover .vft-carousel__mask,.vft-carousel__item--card.is-in-stage:hover .vft-carousel__mask{opacity:.12}.vft-carousel__item--card.is-active{z-index:calc(var(--vft-index-normal) + 1)}.vft-carousel__mask{position:absolute;width:100%;height:100%;top:0;left:0;background-color:var(--vft-color-white);opacity:.24;transition:var(--vft-transition-duration-fast)}

package/theme-style/vft-carousel.css

@@ -0,0 +1 @@
+.vft-carousel{--vft-carousel-arrow-font-size:12px;--vft-carousel-arrow-size:36px;--vft-carousel-arrow-background:rgba(31, 45, 61, 0.11);--vft-carousel-arrow-hover-background:rgba(31, 45, 61, 0.23);--vft-carousel-indicator-width:30px;--vft-carousel-indicator-height:2px;--vft-carousel-indicator-padding-horizontal:4px;--vft-carousel-indicator-padding-vertical:12px;--vft-carousel-indicator-out-color:var(--vft-border-color-hover);position:relative}.vft-carousel--horizontal{overflow-x:hidden}.vft-carousel--vertical{overflow-y:hidden}.vft-carousel__container{position:relative;height:300px}.vft-carousel__arrow{border:none;outline:0;padding:0;margin:0;height:var(--vft-carousel-arrow-size);width:var(--vft-carousel-arrow-size);cursor:pointer;transition:var(--vft-transition-duration);border-radius:50%;background-color:var(--vft-carousel-arrow-background);color:#fff;position:absolute;top:50%;z-index:10;transform:translateY(-50%);text-align:center;font-size:var(--vft-carousel-arrow-font-size);display:inline-flex;align-items:center;justify-content:center}.vft-carousel__arrow--left{left:16px}.vft-carousel__arrow--right{right:16px}.vft-carousel__arrow:hover{background-color:var(--vft-carousel-arrow-hover-background)}.vft-carousel__arrow i{cursor:pointer}.vft-carousel__indicators{position:absolute;list-style:none;margin:0;padding:0;z-index:calc(var(--vft-index-normal) + 1)}.vft-carousel__indicators--horizontal{bottom:0;left:50%;transform:translateX(-50%)}.vft-carousel__indicators--vertical{right:0;top:50%;transform:translateY(-50%)}.vft-carousel__indicators--outside{bottom:calc(var(--vft-carousel-indicator-height) + var(--vft-carousel-indicator-padding-vertical) * 2);text-align:center;position:static;transform:none}.vft-carousel__indicators--outside .vft-carousel__indicator:hover button{opacity:.64}.vft-carousel__indicators--outside button{background-color:var(--vft-carousel-indicator-out-color);opacity:.24}.vft-carousel__indicators--labels{left:0;right:0;transform:none;text-align:center}.vft-carousel__indicators--labels .vft-carousel__button{height:auto;width:auto;padding:2px 18px;font-size:12px;color:#000}.vft-carousel__indicators--labels .vft-carousel__indicator{padding:6px 4px}.vft-carousel__indicator{background-color:transparent;cursor:pointer}.vft-carousel__indicator:hover button{opacity:.72}.vft-carousel__indicator--horizontal{display:inline-block;padding:var(--vft-carousel-indicator-padding-vertical) var(--vft-carousel-indicator-padding-horizontal)}.vft-carousel__indicator--vertical{padding:var(--vft-carousel-indicator-padding-horizontal) var(--vft-carousel-indicator-padding-vertical)}.vft-carousel__indicator--vertical .vft-carousel__button{width:var(--vft-carousel-indicator-height);height:calc(var(--vft-carousel-indicator-width)/ 2)}.vft-carousel__indicator.is-active button{opacity:1}.vft-carousel__button{display:block;opacity:.48;width:var(--vft-carousel-indicator-width);height:var(--vft-carousel-indicator-height);background-color:#fff;border:none;outline:0;padding:0;margin:0;cursor:pointer;transition:var(--vft-transition-duration)}.carousel-arrow-left-enter-from,.carousel-arrow-left-leave-active{transform:translateY(-50%) translateX(-10px);opacity:0}.carousel-arrow-right-enter-from,.carousel-arrow-right-leave-active{transform:translateY(-50%) translateX(10px);opacity:0}

package/theme-style/vft-cascader-panel.css

@@ -0,0 +1 @@
+.vft-cascader-panel{--vft-cascader-menu-text-color:var(--vft-text-regular-color);--vft-cascader-menu-selected-text-color:var(--vft-primary-color);--vft-cascader-menu-fill:var(--vft-bg-color-overlay);--vft-cascader-menu-font-size:var(--vft-font-size-base);--vft-cascader-menu-radius:var(--vft-border-radius-base);--vft-cascader-menu-border:solid 1px var(--vft-border-color-light);--vft-cascader-menu-shadow:var(--vft-box-shadow-light);--vft-cascader-node-background-hover:var(--vft-fill-color-light);--vft-cascader-node-color-disabled:var(--vft-text-placeholder-color);--vft-cascader-color-empty:var(--vft-text-placeholder-color);--vft-cascader-tag-background:var(--vft-fill-color)}.vft-cascader-panel{display:flex;border-radius:var(--vft-cascader-menu-radius);font-size:var(--vft-cascader-menu-font-size)}.vft-cascader-panel.is-bordered{border:var(--vft-cascader-menu-border);border-radius:var(--vft-cascader-menu-radius)}.vft-cascader-menu{min-width:180px;box-sizing:border-box;color:var(--vft-cascader-menu-text-color);border-right:var(--vft-cascader-menu-border)}.vft-cascader-menu:last-child{border-right:none}.vft-cascader-menu:last-child .vft-cascader-node{padding-right:20px}.vft-cascader-menu__wrap.vft-scrollbar__wrap{height:204px}.vft-cascader-menu__list{position:relative;min-height:100%;margin:0;padding:6px 0;list-style:none;box-sizing:border-box}.vft-cascader-menu__hover-zone{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.vft-cascader-menu__empty-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;color:var(--vft-cascader-color-empty)}.vft-cascader-menu__empty-text .is-loading{margin-right:2px}.vft-cascader-node{position:relative;display:flex;align-items:center;padding:0 30px 0 20px;height:34px;line-height:34px;outline:0}.vft-cascader-node.is-selectable.in-active-path{color:var(--vft-cascader-menu-text-color)}.vft-cascader-node.in-active-path,.vft-cascader-node.is-active,.vft-cascader-node.is-selectable.in-checked-path{color:var(--vft-cascader-menu-selected-text-color);font-weight:700}.vft-cascader-node:not(.is-disabled){cursor:pointer}.vft-cascader-node:not(.is-disabled):focus,.vft-cascader-node:not(.is-disabled):hover{background:var(--vft-cascader-node-background-hover)}.vft-cascader-node.is-disabled{color:var(--vft-cascader-node-color-disabled);cursor:not-allowed}.vft-cascader-node__prefix{position:absolute;left:10px}.vft-cascader-node__postfix{position:absolute;right:10px}.vft-cascader-node__label{flex:1;text-align:left;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vft-cascader-node>.vft-checkbox{margin-right:0}.vft-cascader-node>.vft-radio{margin-right:0}.vft-cascader-node>.vft-radio .vft-radio__label{padding-left:0}

package/theme-style/vft-cascader.css

@@ -0,0 +1 @@
+.vft-cascader{--vft-cascader-menu-text-color:var(--vft-text-regular-color);--vft-cascader-menu-selected-text-color:var(--vft-primary-color);--vft-cascader-menu-fill:var(--vft-bg-color-overlay);--vft-cascader-menu-font-size:var(--vft-font-size-base);--vft-cascader-menu-radius:var(--vft-border-radius-base);--vft-cascader-menu-border:solid 1px var(--vft-border-color-light);--vft-cascader-menu-shadow:var(--vft-box-shadow-light);--vft-cascader-node-background-hover:var(--vft-fill-color-light);--vft-cascader-node-color-disabled:var(--vft-text-placeholder-color);--vft-cascader-color-empty:var(--vft-text-placeholder-color);--vft-cascader-tag-background:var(--vft-fill-color);display:inline-block;vertical-align:middle;position:relative;font-size:var(--vft-font-size-base);line-height:32px;outline:0}.vft-cascader:not(.is-disabled):hover .vft-input__wrapper{cursor:pointer;box-shadow:0 0 0 1px var(--vft-input-hover-border-color) inset}.vft-cascader .vft-input{display:flex;cursor:pointer}.vft-cascader .vft-input .vft-input__inner{text-overflow:ellipsis;cursor:pointer}.vft-cascader .vft-input .vft-input__suffix-inner .vft-icon{height:calc(100% - 2px)}.vft-cascader .vft-input .vft-input__suffix-inner .vft-icon svg{vertical-align:middle}.vft-cascader .vft-input .icon-arrow-down{transition:transform var(--vft-transition-duration);font-size:14px}.vft-cascader .vft-input .icon-arrow-down.is-reverse{transform:rotateZ(180deg)}.vft-cascader .vft-input .icon-circle-close:hover{color:var(--vft-input-clear-hover-color,var(--vft-text-secondary-color))}.vft-cascader .vft-input.is-focus .vft-input__wrapper{box-shadow:0 0 0 1px var(--vft-input-focus-border-color,var(--vft-primary-color)) inset}.vft-cascader--large{font-size:14px;line-height:40px}.vft-cascader--small{font-size:12px;line-height:24px}.vft-cascader.is-disabled .vft-cascader__label{z-index:calc(var(--vft-index-normal) + 1);color:var(--vft-disabled-text-color)}.vft-cascader__dropdown{--vft-cascader-menu-text-color:var(--vft-text-regular-color);--vft-cascader-menu-selected-text-color:var(--vft-primary-color);--vft-cascader-menu-fill:var(--vft-bg-color-overlay);--vft-cascader-menu-font-size:var(--vft-font-size-base);--vft-cascader-menu-radius:var(--vft-border-radius-base);--vft-cascader-menu-border:solid 1px var(--vft-border-color-light);--vft-cascader-menu-shadow:var(--vft-box-shadow-light);--vft-cascader-node-background-hover:var(--vft-fill-color-light);--vft-cascader-node-color-disabled:var(--vft-text-placeholder-color);--vft-cascader-color-empty:var(--vft-text-placeholder-color);--vft-cascader-tag-background:var(--vft-fill-color)}.vft-cascader__dropdown{font-size:var(--vft-cascader-menu-font-size);border-radius:var(--vft-cascader-menu-radius)}.vft-cascader__dropdown.vft-popper{background:var(--vft-cascader-menu-fill);border:var(--vft-cascader-menu-border);box-shadow:var(--vft-cascader-menu-shadow)}.vft-cascader__dropdown.vft-popper .vft-popper__arrow::before{border:var(--vft-cascader-menu-border)}.vft-cascader__dropdown.vft-popper[data-popper-placement^=top] .vft-popper__arrow::before{border-top-color:transparent;border-left-color:transparent}.vft-cascader__dropdown.vft-popper[data-popper-placement^=bottom] .vft-popper__arrow::before{border-bottom-color:transparent;border-right-color:transparent}.vft-cascader__dropdown.vft-popper[data-popper-placement^=left] .vft-popper__arrow::before{border-left-color:transparent;border-bottom-color:transparent}.vft-cascader__dropdown.vft-popper[data-popper-placement^=right] .vft-popper__arrow::before{border-right-color:transparent;border-top-color:transparent}.vft-cascader__dropdown.vft-popper{box-shadow:var(--vft-cascader-menu-shadow)}.vft-cascader__tags{position:absolute;left:0;right:30px;top:50%;transform:translateY(-50%);display:flex;flex-wrap:wrap;line-height:normal;text-align:left;box-sizing:border-box}.vft-cascader__tags .vft-tag{display:inline-flex;align-items:center;max-width:100%;margin:2px 0 2px 6px;text-overflow:ellipsis;background:var(--vft-cascader-tag-background)}.vft-cascader__tags .vft-tag:not(.is-hit){border-color:transparent}.vft-cascader__tags .vft-tag>span{flex:1;overflow:hidden;text-overflow:ellipsis}.vft-cascader__tags .vft-tag .vft-icon-close{flex:none;background-color:var(--vft-text-color-placeholder);color:var(--vft-color-white)}.vft-cascader__tags .vft-tag .vft-icon-close:hover{background-color:var(--vft-text-color-secondary)}.vft-cascader__collapse-tags{white-space:normal;z-index:var(--vft-index-normal)}.vft-cascader__collapse-tags .vft-tag{display:inline-flex;align-items:center;max-width:100%;margin:2px 0 2px 6px;text-overflow:ellipsis;background:var(--vft-fill-color)}.vft-cascader__collapse-tags .vft-tag:not(.is-hit){border-color:transparent}.vft-cascader__collapse-tags .vft-tag>span{flex:1;overflow:hidden;text-overflow:ellipsis}.vft-cascader__collapse-tags .vft-tag .vft-icon-close{flex:none;background-color:var(--vft-text-color-placeholder);color:var(--vft-color-white)}.vft-cascader__collapse-tags .vft-tag .vft-icon-close:hover{background-color:var(--vft-text-color-secondary)}.vft-cascader__suggestion-panel{border-radius:var(--vft-cascader-menu-radius)}.vft-cascader__suggestion-list{max-height:204px;margin:0;padding:6px 0;font-size:var(--vft-font-size-base);color:var(--vft-cascader-menu-text-color);text-align:center}.vft-cascader__suggestion-item{display:flex;justify-content:space-between;align-items:center;height:34px;padding:0 15px;text-align:left;outline:0;cursor:pointer}.vft-cascader__suggestion-item:focus,.vft-cascader__suggestion-item:hover{background:var(--vft-cascader-node-background-hover)}.vft-cascader__suggestion-item.is-checked{color:var(--vft-cascader-menu-selected-text-color);font-weight:700}.vft-cascader__suggestion-item>span{margin-right:10px}.vft-cascader__empty-text{margin:10px 0;color:var(--vft-cascader-color-empty)}.vft-cascader__search-input{flex:1;height:24px;min-width:60px;margin:2px 0 2px 11px;padding:0;color:var(--vft-cascader-menu-text-color);border:none;outline:0;box-sizing:border-box;background:0 0}.vft-cascader__search-input::-moz-placeholder{color:transparent}.vft-cascader__search-input::placeholder{color:transparent}

package/theme-style/vft-check-tag.css

@@ -0,0 +1 @@
+.vft-check-tag{background-color:var(--vft-color-info-light-9);border-radius:var(--vft-border-radius-base);color:var(--vft-color-info);cursor:pointer;display:inline-block;font-size:var(--vft-font-size-base);line-height:var(--vft-font-size-base);padding:7px 15px;transition:var(--vft-transition-all);font-weight:700}.vft-check-tag:hover{background-color:var(--vft-color-info-light-7)}.vft-check-tag.is-checked{background-color:var(--vft-color-primary-light-8);color:var(--vft-color-primary)}.vft-check-tag.is-checked:hover{background-color:var(--vft-color-primary-light-7)}