tntd/lib/tntd-action/index.less

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

.tnt-action {
  position: fixed;
  // bottom: 100px;
  // width: @tnt-action-width;
  // left: calc(50vw - @tnt-action-width / 2);
  padding: 10px 16px;
  background-color: @text-color;
  border-radius: @border-radius-base;
  z-index: 200;
  cursor: grab;
  box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.25), 0px 1px 1px 0px #263354 inset;

  &-text {
    color: @white;
    margin-left: 20px;
    font-size: 14px;
    user-select: none;

    .num {
      display: inline-block;
      width: 16px;
      height: 16px;
      background: #454f64;
      border-radius: 8px;
      font-size: 10px;
      margin-right: 4px;
      vertical-align: text-bottom;
      text-align: center;
    }
  }

  >.tnt-btn-tertiary {
    opacity: 0.5;
    background: #454f64;
    color: @white;
    border-width: 0;
    width: @tnt-action-close-width;
    height: @tnt-action-close-width;
    min-width: @tnt-action-close-width;
    line-height: @tnt-action-close-width;
    margin-top: 4px;
    font-size: 14px;

    &:hover {
      opacity: 0.8;
    }
  }

  .fr {
    float: right;

    .ant-btn {
      margin-left: 10px;

      .tntd-anticon {
        margin-right: 4px;
      }
    }

    .ant-btn:not(.ant-btn-danger) {
      background: rgba(69, 79, 100, 0.5);
      color: @white;
      border-width: 0;

      &:hover {
        background: rgba(69, 79, 100, 0.8);
      }
    }
  }
}