@import "../../style/index.less";

@ui-prefix-timeline: yyui-timeline;
@timeline-prefix-cls: ant-timeline;
@timeline-color: @border-color-split;

.@{ui-prefix-timeline}{
  position: relative;
  .@{timeline-prefix-cls} {
    //list-style: none;
    //margin: 0;
    //padding: 0;
    //
    &-item {
    //  position: relative;
    //  padding: 0 0 12px 0;
    //  list-style: none;
    //  margin: 0;
    //
    //  &-tail {
    //    position: absolute;
    //    left: 5px;
    //    top: 0;
    //    height: 100%;
    //    border-left: 2px solid @timeline-color;
    //  }
    //
    //  &-pending &-tail {
    //    display: none;
    //  }
      &-head {
        position: absolute;
        width: 12px;
        height: 12px;
        background-color: #fff;
        border-radius: 100px;
        border: 2px solid transparent;
        &-blue {
          border-color: @primary-color;
          color: @primary-color;
        }
        &-red {
          border-color: @error-color;
          color: @error-color;
        }
        &-green {
          border-color: @success-color;
          color: @success-color;
        }
      }
      &-head-custom {
        position: absolute;
        text-align: center;
        width: 40px;
        left: -14px;
        line-height: 1;
        margin-top: 6px;
        border: 0;
        height: auto;
        border-radius: 0;
        padding: 3px 0;
        font-size: 12px;
        transform: translateY(-50%);
      }

      //&-content {
      //  padding: 0 0 10px 24px;
      //  font-size: @font-size-base;
      //  position: relative;
      //  top: -3px;
      //}
      //
      //&-last {
      //  .@{timeline-prefix-cls}-item-tail {
      //    border-left: 2px dotted @timeline-color;
      //    display: none;
      //  }
      //  .@{timeline-prefix-cls}-item-content {
      //    min-height: 48px;
      //  }
      //}
    }

    &&-pending &-item-last &-item-tail {
      display: block;
    }
  }
}