ten-design-vue/lib/theme/components/select.less

ten-vue

/* dependencies input,icon,loading,popup */
@import "../vars.less";
.vue-recycle-scroller{position:relative}.vue-recycle-scroller.direction-vertical:not(.page-mode){overflow-y:auto}.vue-recycle-scroller.direction-horizontal:not(.page-mode){overflow-x:auto}.vue-recycle-scroller.direction-horizontal{display:-webkit-box;display:-ms-flexbox;display:flex}.vue-recycle-scroller__slot{-webkit-box-flex:1;-ms-flex:auto 0 0px;flex:auto 0 0}.vue-recycle-scroller__item-wrapper{-webkit-box-flex:1;-ms-flex:1;flex:1;-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;position:relative}.vue-recycle-scroller.ready .vue-recycle-scroller__item-view{position:absolute;top:0;left:0;will-change:transform}.vue-recycle-scroller.direction-vertical .vue-recycle-scroller__item-wrapper{width:100%}.vue-recycle-scroller.direction-horizontal .vue-recycle-scroller__item-wrapper{height:100%}.vue-recycle-scroller.ready.direction-vertical .vue-recycle-scroller__item-view{width:100%}.vue-recycle-scroller.ready.direction-horizontal .vue-recycle-scroller__item-view{height:100%}.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}

.ten-select {
  cursor: pointer;
}

.ten-select-input {
  cursor: pointer;
  .ten-input__input-input:not(:disabled):read-only {
    cursor: pointer;
  }
  .ten-input__input-icon {
    font-size: 14px;
  }
  .ten-input__input-icon .ten-icon--carret_down {
    transition: transform 0.3s;
  }

  &--popupshow {
    .ten-input__input-icon .ten-icon--carret_down {
      transform: rotate(180deg);
    }
  }
}

.ten-select-options {
  max-height: 400px;
  overflow-y: auto;
  outline: none;
}

.ten-select-option {
  padding: 13px 10px;
  line-height: 22px;
  cursor: pointer;
  word-break: break-all;

  .ten-checkbox {
    margin-right: 8px;
  }

  &--selected {
    color: @primary-color;
  }
  &:hover:not(.ten-select-option--disabled), 
  &:focus:not(.ten-select-option--disabled), 
  &.ten-select-option--focused:not(.ten-select-option--disabled) {
    background: @primary-color-ligher-7;
  }
  // 禁用
  &--disabled {
    color: @disabled-color;
    cursor: not-allowed;
  }
}

.ten-select__popup {
  &-content {
    position: relative;
  }
  &.ten-popup {
    padding: 0;
  }
  &--size-small {
    .ten-select-option {
      min-height: 40px;
      line-height: 40px;
    }
  }

  &--loading &-content {
    min-height: 48px;
  }

  .ten-select__empty {
    text-align: center;
    color: @text-color-lighter-2;
    line-height: 48px;
  }
}

.ten-select-group {
  &__title {
    font-size: 14px;
    padding: 13px 10px;
    line-height: 22px;
    color: @text-color-lighter-2;
  }
}