el-steps 步骤条自定义样式
代码
<el-steps direction="vertical" :active="4" class="stepStyle">
<el-step title="2023-12-13 13:01:00" description="XX报警" />
<el-step title="2023-12-13 13:01:05" description="短信通知至:张三" />
<el-step title="2023-12-13 13:01:05" description="微信通知至:李四" />
<el-step title="2023-12-13 13:02:50" description="后续继续处理" />
</el-steps>
:deep(.el-step) {
background-color: #262626;
border-color: #ddd;
color: #333;
}
:deep(.el-step__title) {
font-size: 12px;
color: #d3cece;
}
:deep(.el-step__description) {
color: #d3cece;
}
:deep(.el-step__icon) {
background-color: #38b8a7;
width: 14px;
height: 14px;
}
:deep(.el-step.is-vertical .el-step__line) {
width: 2px;
top: 2px;
bottom: -1px;
left: 6px;
}