lixin-web/webapp/less/lottery/open-time.less

vue and bootstrap

.lottery-open-code,.lottery-open-time{
  text-align: center;
  .expect{
    color: #fff;
    margin-bottom: 5px;
    line-height: 28px;
    border-top:1px solid fade(#fff,40);
    position: relative;
    margin-top: 12px;
    &:before,&:after{
      content: '';
      width: 1px;
      background: fade(#fff,40);
      height: 10px;
      position: absolute;
    }
    &:before{
      left: 0;
    }
    &:after{
      right: 0;
    }
  }
}

.lottery-open-time{

  @media (max-width:@screen-sm-max) and (min-width:@screen-sm){
    //width: 1/3 * 100%;
    //float: left;
    //padding-right: ceil((@grid-gutter-width / 2));
    //.expect{
    //  margin-bottom: 40px;
    //}
  }
}

.rest-open-time{
  display: inline-block;
  > div{
    background: fade(#fff,20);
    border-radius:50%;
    float: left;
  }
  > span{
    float: left;
    color: #fff;
    width: 20px;
    line-height: 50px;
    font-size:22px;
  }

  .knob{
    font-size: 20px!important;
    color: #fff!important;
    .user-select(none);
    text-align: left!important;
    &.hour:after{
      content: 'h';
    }
  }
  canvas{

  }
  em{
    float: left;
    margin-left: -17px;
    color: #fff;
    font-style: normal;
    margin-top: 17px;
  }
}

@media (max-width:@screen-sm-max) and (min-width:@screen-sm){
  .rest-open-time{

  }
}