lojk-ui/src/components/lotusPipeItem/lotusPipeItems.less

lojk vue ui components library

@import (reference) "../../style/config";

@arrowColor: #9a9a9a;
@register: pipe-items;
.@{register} {
  height: 100%;
  &-wrap{
    position: relative;
    .paddingLeft(30);
    .minheight(88);
    .flex();
    .flex-hc();
  }
  &-wrap-retract{
    padding-left: 0;
    .marginLeft(30);
  }
  &-wrap-between{
    .paddingRight(40);
    .flex-between();
  }
  &-arrow{
    /*箭头*/
    &:after{
      content:'';
      position: absolute;
      .right(20);
      top:50%;
      transform: translateY(-50%) rotate(45deg);
      .width(20);
      .borderTop(3);
      .borderRight(3);
      border-top-style: solid;
      border-right-style: solid;
      border-color: @arrowColor;
    }
  }
  /*去掉箭头*/
  &-noarrow{
    &:after{
      display: none!important;
    }
  }
  /*上、下划线*/
  &-underline,&-overline{
    position: relative;
    &:before{
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 1px;
      -webkit-transform: scaleY(.5);
      transform: scaleY(.5);
      background: #e5e5e5;
    }
  }
  /*无下划线*/
  &-nounderline{
    &:before{
      display: none!important;
    }
  }
  /*上划线*/
  &-overline{
    &:before{
      top: 0;
    }
  }
  &-image{
    .marginRight(20);
    .widthSingle(54);
    .heightSingle(54);
  }
  &-text{
    padding: 0!important;
    .fontSize(32);
    color: #333;
  }
}