iep-ui/es/iep-sundry-transfer/style/index.less

An enterprise-class UI design language and Vue-based implementation

@import '../../style/themes/index';
@import '../../style/mixins/index';

.flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.@{ant-prefix}-iep-sundry-transfer {
  width: 550px;
  height: 400px;
  border-radius: @border-radius-base;
  background: #fff;
  border: 1px solid @border-1;
  box-shadow: @shadow-3;
  display: flex;
  overflow: hidden;
  flex-direction: column;
  &-header {
    height: 40px;
    border-bottom: 1px solid @border-1;
    padding: 0 12px;
    .flex();
    &-tag {
      font-weight: 400;
      font-size: 12px;
      color: #999;
    }
  }
  &-footer {
    flex: 1;
    .flex();
    overflow: hidden;
    &-item {
      flex: 1;
      overflow: hidden;
      height: 100%;
      width: 100%;
      .flex();
      flex-direction: column;
      box-sizing: border-box;
      &:first-child {
        border-right: 1px solid @border-1;
      }
      &-header {
        width: 100%;
        padding: 12px;
        height: 56px;
        &-text {
          font-weight: 400;
          font-size: 14px;
          color: #999;
          line-height: 32px;
        }
      }
      &-footer {
        flex:1;
        width: 100%;
        overflow: hidden;
        padding: 0 0 12px 12px;
        user-select: none;
        &-inner {
          .flex();
          padding-right: 12px;
          flex-direction: column;
          align-items: flex-start;
          height: 290px;
          justify-content: flex-start;
          gap: 10px 0;
          &-empty {
            justify-content: center;
            align-items: center;
          }
        }
      }
    }
  }
  &-select-item {
    .flex();
    width: 100%;
    &-text {
      font-weight: 400;
      font-size: 14px;
      color: #333;
      overflow:hidden;
      text-overflow: ellipsis;
    }
    &-btn {
      cursor: pointer;
    }
  }
}