zcloud-gbs-bi-react/src/pages/Container/Map/components/Content/index.less

.map_content_container {
  &__content {
    width: 410px;
    position: absolute;
    left: 35px;
    top: 75px;
    max-height: calc(100vh - 75px);

    // 定义循环混合宏
    .loop (@i: 1) when (@i <= 5) {
      .line-@{i} {
        // 第1行：单行省略
        & when (@i = 1) {
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
        }

        // 第2-5行：多行省略
        & when not (@i = 1) {
          display: -webkit-box !important;
          overflow: hidden;
          text-overflow: ellipsis;
          word-break: break-all;
          -webkit-line-clamp: @i;
          -webkit-box-orient: vertical !important;
        }
      }
      // 递归调用
      .loop(@i + 1);
    }

    // 执行循环
    .loop();
  }

  .collapse_menu {
    position: absolute;
    left: 445px;
    top: calc(50vh - 44.5px);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    cursor: pointer;

    &.active {
      left: 0;

      img {
        transform: translate(-50%, -50%) rotate(180deg);
      }
    }

    img {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%) rotate(0);
    }

    &.port {
      width: 30px;
      height: 89px;

      .img {
        width: 10px;
        height: 17px;
      }
    }

    &.branch_office {
      width: 33px;
      height: 116px;

      .img {
        width: 13px;
        height: 34px;
      }
    }
  }
}