.task-list-box { width 100% padding 10px color #ffffff overflow-x hidden .task-list-inner { .el-tabs { --el-tabs-header-height: 55px; } .el-tabs__item { color: #fff; font-size: 18px; } .title-tabs .el-tabs__item.is-active { color: #47FFF1; font-size: 18px; } .title-tabs .el-tabs__active-bar { background-color: #47FFF1; } .el-textarea { --el-input-focus-border-color: #47FFF1; } .el-textarea__inner { background: transparent; color: #fff; } .el-input__wrapper { background: transparent; padding 5px } .text { margin-bottom: 10px; color: #6b778c; font-size: 15px } .param-line.pt { padding-top 5px padding-bottom 5px } .form-item-inner { display flex align-items: center .el-icon { margin-left 10px } } .el-form-item__label { color #ffffff } // 图片上传样式 .img-inline { display flex .img-uploader { .el-upload { border: 1px dashed var(--el-border-color); border-radius: 6px; cursor: pointer; position: relative; overflow: hidden; width 120px; transition: var(--el-transition-duration-fast); margin-bottom: 20px; &:hover { border-color: var(--el-color-primary); } .el-icon.uploader-icon { font-size: 28px color: #8c939d width 100% height: 120px text-align: center } } } .img-list-box { display flex .img-item { width 120px position relative margin-right 10px .el-image { width 120px height 120px border-radius 5px } .el-button { position absolute right 5px top 5px width 20px height 20px } } } } // 提交按钮 .submit-btn { display flex margin: 20px 0 .el-button { width 200px } .text-info { width 100% display flex justify-content right align-items center } } // 任务列表 .job-list-box { .running-job-list { .job-item { //border: 1px solid #454545; width: 100%; padding 2px background-color #555555 .job-item-inner { position relative height 100% overflow hidden .progress { position absolute width 100% height 100% top 0 left 0 display flex justify-content center align-items center span { font-size 20px color #ffffff } } } } } .finish-job-list { .job-item { width 100% height 100% border 1px solid #666666 padding 6px overflow hidden border-radius 6px transition: all 0.3s ease; /* 添加过渡效果 */ position relative .opt { .opt-line { margin 6px 0 ul { display flex flex-flow row li { margin-right 6px a { padding 3px 0 width 40px text-align center border-radius 5px display block cursor pointer background-color #4E5058 color #ffffff &:hover { background-color #6D6F78 } } } .show-prompt { font-size 20px cursor pointer } } } } .remove { display none position absolute right 10px top 10px } &:hover { .remove { display block } } } .animate { &:hover { box-shadow: 0 0 10px rgba(71, 255, 241, 0.6); /* 添加阴影效果 */ transform: translateY(-10px); /* 向上移动10像素 */ } } } .el-image { width 100% height 100% overflow visible img { height 240px } .el-image-viewer__wrapper { img { width auto height auto } } .image-slot { display flex flex-flow column justify-content center align-items center min-height 200px color #ffffff height 240px .iconfont { font-size 50px margin-bottom 10px } } } .el-image.upscale { img { height 310px } .image-slot { height 310px } .el-image-viewer__wrapper { img { width auto height auto } } } } } .no-more-data { text-align center padding 20px } }