.border() { border: 1px solid rgba(238, 238, 238, 1); } .line-block(@top:0,@left:0,@bg:rgba(38,150,92,1)) { position: absolute; display: block; top: @top; left: @left; content: ''; width: 2px; height: 12px; background: @bg; } .container-box-block { margin-bottom: 20px; } .tow-container-box { display: flex; margin: 20px; .left-box, .right-box { width: 800px; margin: 0 12px; } } .card-box { .border(); .card-box-title { background: rgba(246, 246, 246, 1); padding: 11px 15px; position: relative; font-size: 14px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: rgba(38, 150, 92, 1); &:after { .line-block(15px, 8px) } } .card-box-container { padding: 12px 12px 0 12px; &.fuse-box-container { padding: 0; .table-box { margin: -1px; } } .card-box-container-text { .card-box-container-text-item-wrapper { margin-bottom: 10px; display: flex; .card-box-container-text-item { font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(102, 102, 102, 1); display: flex; min-width: 260px; > span { font-size: 12px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: rgba(85, 85, 85, 1); min-width: 61px; display: block; } > a { font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(1, 170, 237, 1); text-decoration: underline; } } } } } } .progress-bar-box { padding: 10px; .progress-bar-box-wrapper { border-left: 2px solid #EEEEEE; padding-left: 10px; .progress-bar-box-item { position: relative; padding-bottom: 20px; &:first-child:before { position: absolute; content: ''; top: 0px; left: -16px; width: 10px; height: 10px; background-color: #fff; border-radius: 50%; } &:after { position: absolute; content: ''; top: 5px; left: -16px; width: 10px; height: 10px; background: rgba(221, 221, 221, 1); border-radius: 50%; } .progress-bar-box-item-title { font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(102, 102, 102, 1); } .progress-bar-box-item-message { font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(51, 51, 51, 1); } } } } .select-box { border: 1px solid rgba(238, 238, 238, 1); font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(102, 102, 102, 1); } .table-box { &.deepen-thead { thead { background: rgba(246, 246, 246, 1); th { border: 1px solid rgba(246, 246, 246, 1); } } } table { width: 100%; border-collapse: collapse; th, td { padding: 12px; border: 1px solid rgba(238, 238, 238, 1); } thead { th { text-align: center; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(51, 51, 51, 1); } } tbody { td { padding-left: 17px; font-size: 13px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(102, 102, 102, 1); } } } } .btn-box{ &.primary-btn{ background:rgba(38,150,92,1); border-radius:3px; font-size:12px; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(255,255,255,1); padding: 5px 10px; text-align: center; } } .tab-box { width: 100%; overflow-y: auto; .border(); .tab-box-title { background: rgba(238, 238, 238, 1); border-bottom: 1px solid rgba(231, 231, 231, 1); display: flex; .tab-box-title-item { padding: 10px 20px; font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: rgba(0, 0, 0, 1); cursor: pointer; &.checked { background-color: #fff; } } } .tab-box-container { padding: 15px; } }