lixin-web/webapp/less/lottery/chase.less

vue and bootstrap

.lottery-chase-modal{
  .tabs{
    > a {
      font-size:@font-size-medium;
      border-color:@brand-primary;
      color: @brand-primary;
      &.active{
        background: @brand-primary;
        color: #fff;
      }
    }
  }
  tr{
    line-height: 34px;
  }
  input[type="checkbox"]{
    @media screen and (-webkit-min-device-pixel-ratio:0) {
      .to-el-checkbox();
    }
  }
  .bootstrap-dialog-title{
    > span{
      font-size:@font-size-base;
    }
  }
  .panels{
   .options{
     padding: 25px 0px 5px 0;
     text-align:left;
     .form-control{
       width: 90px;
       height: 30px;
     }
   }
  }
  .tab-row{
    section{
      display: none;
      &.active{
        display: inline-block;
      }
    }
    select{
      padding-left: 2px;
      padding-right: 2px;
      font-size: 14px;
      padding-top: 3px;
    }
    input[type="checkbox"]{
      margin-top: 0;
      margin-left: 5px;
    }
  }
  .btn{
    span{
      margin-right: 5px;
    }
  }
  .fixed-table-container{
    border-bottom:none;
  }
  .fixed-table-body{
    border-bottom:1px solid @gray-light;
  }
  .fixed-table-footer{
    border-top:none;
    margin-left: -1px;
    margin-right: -1px!important;
    font-size:@font-size-medium;
    .th-inner{
      padding-left: 0;
      padding-right: 0;
    }
  }

  .modal-header{
    text-align:left;
    padding-left: @modal-title-padding;
  }
  td,th{
    border: none!important;
  }
  td{
    padding-top: 3px!important;
    padding-bottom: 3px!important;
  }

  @media (min-width:@screen-sm){
    text-align:center;
    .tabs > a{
      width: 116px;

    }
    .modal-dialog{
      width: @screen-sm - ceil((@grid-gutter-width / 2)) * 2;
    }
    .tab-row{
      margin-bottom: 10px;
      .form-group:last-child{

      }
    }
    section{
      > div:first-child{
        padding-left: 0;
      }
      > div:last-child{
        text-align: right;
        padding-right: 0;
      }
    }
    .fixed-table-body{
      height: 280px;
    }
    .fixed-table-footer{
      .th-inner{
        padding-top: 20px;
      }
      .fht-cell{
        padding-bottom: 5px;

      }
    }
    .modal-body{
      padding-bottom: 5px;
    }
    .modal-footer{
      padding-bottom: 0;
    }
    .bootstrap-dialog-footer-buttons{
      position: relative;
      margin-top: -50px;
    }
    .panels{
      .options{
        .form-control{
          width: 115px;
        }
      }
    }
  }
  @media(min-width: @screen-md){
    .modal-dialog{
      width: 842px;
    }
    .tab-row{
      .form-group:last-child{
        padding-left: 58px;
      }
    }
  }
  @media (max-width: @screen-xs-max){

    .modal-body{
      padding: 5px;
    }
    .modal-footer{
      padding: 5px;
      .btn{
        font-size:@font-size-base;
        width:auto;
      }
    }
    .form-group{
      margin-bottom: 5px;
    }
    .form-control[name="expect"]{
      display: inline-block;
    }
    .form-inline{
      padding-left: 12px;
      > *{
        &,.form-group{
          float: left;
          padding-right: 0;
          padding-left: 5px;
        }

      }
    }
    .fixed-table-container{
      height:170px!important;
    }
    .editableform{
      &.form-inline{
        &,& > div{
          padding-left: 0;
        }
      }
      .form-control{
        padding-top: 2px;
        padding-bottom: 2px;
        height: 24px;
      }
    }
    .editable-buttons{
      .btn{
        padding-top: 2px;
        padding-bottom: 2px;
        padding-left: 6px;
        padding-right: 6px;
        width: 24px;
      }
    }
    .card-views{
      .value{
        display:inline-block;
        height: 24px;
      }
    }
  }
}