lixin-web/webapp/less/lottery/adjust-prize.less

vue and bootstrap

.adjust-prize{
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: 26px;
  .slider{
    display: inline-block;
    & + div{
      display: none;
    }
    //&.adjust-one{
    //  margin-left: 5px;
    //  margin-right: 5px;
    //  border:1px solid @gray-light;
    //  padding-left: 5px;
    //  padding-right: 5px;
    //  line-height: 21px;
    //  background: #fff;
    //}
  }
  > select{
    margin-left: 5px;
    margin-right: 5px;
    width: 112px;
    border-color:@gray-light;
  }
  //.noUi-target {
  //  height: 5px;
  //  border: none;
  //  border-radius: 2px;
  //  padding-right: 0;
  //  width: 130px;
  //  vertical-align: middle;
  //  margin-left: 5px;
  //  margin-right: 5px;
  //  .noUi-handle{
  //    width: 14px;
  //    height: 14px;
  //    border: none;
  //    border-radius: 50%;
  //    top: -5px;
  //    left: -12px;
  //    cursor: pointer;
  //    background: @brand-primary;
  //    box-shadow: none;
  //    &:before,&:after{
  //      content: none;
  //    }
  //  }
  //}
  //.noUi-connect{
  //  background: @brand-primary;
  //}
  //.noUi-background{
  //  border-radius: 2px;
  //}

  //[data-field="code"]{
  //  width: 53px;display: inline-block;
  //}
  //[data-field="point"]{
  //  display: inline-block;
  //  width: 28px;
  //}

  .prize{
    margin-left: 10px;
    span{
      color: @brand-primary;
      margin-left: 5px;
    }
    & + span{
      span{
        margin-left: 5px;
      }
    }
  }
  @media (min-width:@screen-sm){

  }
  @media (min-width:@screen-md){
    float: right;
    padding-right: 25px;
  }
  @media (max-width:@screen-sm-max){
    clear: both;
    padding-left: 18px;
    padding-top: 10px;
  }
  @media (max-width:@screen-xs-max){
    padding-top: 0;
    .slider{
      display: block;
    }
    .prize{
      margin-left: 0;
    }
  }
}