tntd/lib/ellipsis/index.less

tntd是基于 TNT Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。

.tntd-ellipsis {
  display: flex;

  .overflow {
    // white-space:nowrap;     //溢出不换行
    overflow: hidden; //超出的文本隐藏
    text-overflow: ellipsis; //溢出用省略号显示
    i {
      margin: 0 0.3em;
    }
  }

  .fix-align {
    display: inline-flex;
    width: 100%;
  }

  .min-width-0 {
    min-width: 0;
  }

  .ellipsis-nowrap {
    white-space: nowrap; //溢出不换行
    & * {
      overflow: hidden; //超出的文本隐藏
      text-overflow: ellipsis; //溢出用省略号显示
    }
  }

  .ellipsis-wrap {
    display: -webkit-inline-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .button {
    height: 20px;
    width: 20px;
    display: inline-flex;
    align-items: center;
    margin-left: 8px;
    :hover {
      cursor: pointer;
    }
  }

  .button-hidden {
    display: none !important;
  }

  .button-active {
    display: inline-flex;
    g {
      animation: copy-active 0.3s;
    }
  }

  .svg-button {
    margin-left: 2px;
  }

  @keyframes copy-active {
    from {
      stroke: #07c790;
    }
    to {
      stroke: #1e90ff;
    }
  }
}