1
任务名称
2
对象类型
3
时空范围
4
选择库
5
预警等级
body {
overflow:hidden;
margin:0;
padding:0;
color:#fff;
background-color:#12172a;
}
ul {
padding:0;
margin:0;
list-style:none;
}
.main {
width:100vw;
height:95vh;
padding:1vh 1vw;
display:flex;
overflow-y:auto;
}
.main::-webkit-scrollbar {
display:none;
}
.left {
width:160px;
height:100%;
position:relative;
margin-top:25px;
}
.title-box {
display:flex;
}
.index {
width:36px;
height:36px;
line-height:36px;
text-align:center;
color:#fff;
background:#A5CCF8;
border-radius:50%;
position:relative;
z-index:111;
}
.main-title {
line-height:36px;
color:#A5CCF8;
margin-left:10px;
}
.line {
height:510px;
border-left:2px dashed #293144;
position:absolute;
left:17px;
top:12px;
}
.right {
width:calc(100% - 160px);
height:100%;
margin-top:25px;
}
.form-data {
width:96%;
height:60px;
border:1px solid #323c55;
display:flex;
flex-direction:column;
align-items:flex-start;
justify-content:center;
margin:0 0 25px;
}
.form-item {
height:6vh;
display:flex;
align-items:center;
}
.form-label {
width:10vw;
text-align:right;
padding-right:2vw;
color:#7695b7;
}
.input-block {
width:65vw;
}
.form-text {
width:20vw;
height:4vh;
border:1px solid #323c55;
border-radius:3px;
padding:0 0.5vw;
color:#fff;
display:flex;
align-items:center;
justify-content:space-between;
}
.form-icon {
width:14px;
height:19px;
background:url(../../img/exitAndEntry/warningChart/P15.png) no-repeat;
background-size:100% 100%;
}
.input,.select {
width:100%;
height:4vh;
color:#7695b7;
background-color:#13182C;
border:1px solid #323c55;
text-indent:12px;
border-radius:3px;
}
radio {
margin-right:1vw;
}
.textarea {
width:100%;
height:7vh;
color:#7695b7;
background-color:#13182C;
border:1px solid #323c55;
text-indent:12px;
}
input[type=radio] {
margin-right:5px;
cursor:pointer;
font-size:14px;
width:15px;
height:12px;
position:relative;
}
input[type=radio]:after {
position:absolute;
width:10px;
height:15px;
top:-1px;
content:" ";
background-color:#13182C;
border:1px solid #323c55;
color:#fff;
display:inline-block;
visibility:visible;
padding:0px 3px;
border-radius:50%;
}
input[type=radio]:checked:before {
content:"";
display:block;
position:relative;
width:10px;
height:10px;
border-radius:50%;
background-color:#3E97D6;
top:2px;
left:4px;
z-index:1;
}
.unit-time {
display:flex;
justify-content:space-between;
align-items:center;
width:20vw;
height:4vh;
background-color:transparent;
border:1px solid #323c55;
border-radius:3px;
padding:0 0.5vw;
}
.time-input {
width:18vw;
background-color:#13182c;
border:0;
color:#7fbdff;
text-align:center;
}
.time-icons {
width:16px;
height:16px;
background:url(../../img/zhengBao/select-time.png) no-repeat;
background-size:100% 100%;
}
/* 按钮切换 -s */
.button-item {
width:7vw;
height:calc( 4vh - 2px );
line-height:4vh;
color:#7695b7;
text-align:center;
cursor:pointer;
font-size:1.6vh;
border-radius:3px;
border:1px solid #323c55;
margin-left:2vw;
}
.form-item .active {
color:#ffffff;
background-color:#0d8ddb;
}
/* 按钮切换 -e */更新时间:2022-06-20 01:06:12
设计图有类似步骤条样式,但没步骤条的功能,就自己写了这样的样式.