amis/scss/components/form/_transfer-select.scss

.#{$ns}TransferSelectControl {
  display: flex;
  height: px2rem(300px);

  .#{$ns}TransferSelect {
    &-allOptions,
    &-selectedOptions {
      height: 100%;
      flex: 1;
      border: $borderWidth solid $borderColor;
      overflow: auto;

      .#{$ns}TransferSelect-heading {
        position: relative;
        height: px2rem(40px);
        line-height: px2rem(40px);
        padding-left: px2rem(20px);
        border-bottom: $TransferSelect-heading-borderBottom;
      }

      .#{$ns}TransferSelect-body {
        table tbody tr td,
        ul li {
          position: relative;
        }

        ul {
          margin: 0;
          padding: 0;
          padding-top: px2rem(10px);
        }

        li {
          height: px2rem(30px);
          line-height: px2rem(30px);
          list-style: none;
          padding-left: px2rem(20px);
        }
      }

      .#{$ns}TransferSelect-selectAll,
      .#{$ns}TransferSelect-clearAll {
        position: absolute;
        right: 20px;
        cursor: pointer;
        color: $primary;
      }

      .#{$ns}TransferSelect-searchWrapper {
        i {
          height: px2rem(17px);
          line-height: px2rem(17px);
        }
      }
    }

    &-allOptions {
      &--table {
        .#{$ns}TransferSelect-heading {
          background-color: $TransferSelect--table-heading-bg;
          display: flex;
        }

        .#{$ns}TransferSelect-searchWrapper {
          display: inline-block;
          padding: px2rem(3px) px2rem(10px);
          flex: 1;
          margin-left: px2rem(30px);
        }
      }

      &--normal {
        .#{$ns}TransferSelect-heading {
          background-color: $TransferSelect--normal-heading-bg;
        }

        .#{$ns}TransferSelect-searchWrapper {
          padding: px2rem(10px) px2rem(20px);
        }
      }
    }

    &-selectedOptions {
      &--table {
        .#{$ns}TransferSelect-heading {
          background-color: $TransferSelect--table-heading-bg;
        }
      }

      &--normal {
        .#{$ns}TransferSelect-heading {
          background-color: $TransferSelect--normal-heading-bg;
        }
      }
    }

    &-option-close {
      width: px2rem(12px);
      height: px2rem(12px);
      position: absolute;
      right: px2rem(20px);
      cursor: pointer;
    }

    &-action {
      padding: 0 px2rem(20px);

      .#{$ns}TransferSelect-actionIcon {
        display: inline-block;
        width: 0;
        height: 0;
        border-top: px2rem(12px) solid transparent;
        border-left: px2rem(12px) solid #b7b7b7;
        border-bottom: px2rem(12px) solid transparent;
        position: relative;
        top: calc(50% - 6px);
      }
    }
  }
}