You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
155 lines
2.9 KiB
Plaintext
155 lines
2.9 KiB
Plaintext
|
|
.DashbCon{display: flex;flex-direction:row;width: 90%;margin:0 auto}
|
|
.DashbCon>div{flex: 1;position: relative;height: 130px;overflow: hidden;}
|
|
.DashbCon .multiple{display: flex;flex-direction: column;}
|
|
.DashbCon .circle{
|
|
font-size: 12px;
|
|
padding-right:5px;
|
|
position: relative;
|
|
padding-left:10px;
|
|
}
|
|
.DashbCon .circle>div{
|
|
position: absolute;
|
|
width: 10px;
|
|
height: 10px;
|
|
background: gray;
|
|
border-radius: 5px;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
left: 0
|
|
}
|
|
.DashbCon .daughter{
|
|
flex: 1;
|
|
position: relative;
|
|
}
|
|
.DashbCon .circleDot ,.roundDot{
|
|
position: absolute;
|
|
background: white;
|
|
z-index: 10;
|
|
padding: 0 10px;
|
|
}
|
|
.DashbCon .roundDot .circle{
|
|
float:left;
|
|
font-size: 12px;
|
|
align-items: center;
|
|
display: -webkit-flex;
|
|
height: 100%;
|
|
}
|
|
.DashbCon .circleDot{
|
|
left:50%;
|
|
transform: translate(-50%,-50%);
|
|
top:50%;
|
|
align-items:center;
|
|
display: -webkit-flex;
|
|
}
|
|
.DashbCon .roundDot{
|
|
top:50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
.DashbCon .roundDot .data{
|
|
font-size: 12px;
|
|
background: white;
|
|
padding-left: 5px;
|
|
align-items: center;
|
|
display: -webkit-flex;
|
|
float:left;
|
|
height: 100%
|
|
}
|
|
.DashbCon .roundDot .name{
|
|
font-size: 12px;
|
|
align-items: center;
|
|
display: -webkit-flex;
|
|
float:left;
|
|
height: 100%
|
|
}
|
|
.DashbCon .finishColor{
|
|
background: #3385ff;
|
|
}
|
|
.DashbCon .procedure{
|
|
background: #eee;;
|
|
}
|
|
.DashbCon .contentCon{
|
|
width: 100%;
|
|
position: absolute;
|
|
left:50%;
|
|
top:105px;
|
|
transform: translate(-50%,-50%);
|
|
text-align: center;
|
|
}
|
|
.DashbCon .alone p{
|
|
font-size: 12px;
|
|
line-height: 20px;
|
|
}
|
|
.DashbCon>div .figure{
|
|
width: 100%;
|
|
height: 2px;
|
|
position: absolute;
|
|
top:50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
.DashbCon>div:first-child .figure{
|
|
width: calc(50% - 20px);
|
|
height: 2px;
|
|
position: absolute;
|
|
top:50%;
|
|
transform: translateY(-50%);
|
|
right: 0;
|
|
}
|
|
.DashbCon>div:last-child .figure{
|
|
width: calc(50% - 20px);
|
|
height: 2px;
|
|
position: absolute;
|
|
top:50%;
|
|
transform: translateY(-50%);
|
|
left: 0;
|
|
}
|
|
.DashbCon .multiple .figure{
|
|
position: absolute;
|
|
width: calc(100% - 20px);
|
|
height: 2px;
|
|
top:50%;
|
|
transform: translateY(-50%);
|
|
left: 50%;
|
|
}
|
|
.DashbCon .gray .circle div{
|
|
background:gray;
|
|
}
|
|
.DashbCon .gray .figure{
|
|
background: gray;
|
|
}
|
|
.DashbCon .gray .contentCon p{
|
|
color:gray ;
|
|
}
|
|
.DashbCon .green .circle div{
|
|
background: #409EFF;
|
|
}
|
|
.DashbCon .green .figure{
|
|
background: #409EFF;
|
|
}
|
|
.DashbCon .red .circle div{
|
|
background: #F56C6C;
|
|
}
|
|
.DashbCon .red .figure{
|
|
background:#F56C6C;
|
|
}
|
|
.DashbCon .green{
|
|
color:#409EFF!important;
|
|
}
|
|
.DashbCon .gray .data{
|
|
color: gray;
|
|
}
|
|
|
|
|
|
.Dashboard2Warn{
|
|
font-size: 12px;
|
|
color:red;
|
|
text-indent: 1em
|
|
}
|
|
.Dashboard2 .downLoad{
|
|
display: inline-block
|
|
}
|
|
.Dashboard2 .upBtn .el-form-item__content{
|
|
/*width: 95px!important;*/
|
|
height:30px!important;
|
|
/*overflow: hidden*/
|
|
} |