SwitchHosts/src1/ui/components/frame/group.less

#hosts-group {
  @h: 160px;

  position: relative;
  margin-top: 20px;
  height: @h + 2px;
  overflow: hidden;

  &::after {
    content: '';
    clear: both;
  }

  .arrow {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    transform: translate(-50%, -50%);

    &::after {
      content: '→';
    }
  }

  .hosts-group-list {
    height: @h;
    overflow: auto;
    border: solid 1px #ccc;

    .hosts-item {
      cursor: move;
      padding: 2px 6px;

      &:hover {
        background: #f5f5f5;
      }

      i {
        font-size: 12px;
        color: #999;
      }

      & > span {
        padding-left: 6px;
      }
    }
  }
}

#hosts-group-valid {
  width: 45%;
  float: left;
}

#hosts-group-current {
  width: 45%;
  float: right;
}