pbl-teacher-table/src/assets/css/button.css

.c_pub_button_confirm {
  color: #fff;
  background-color: #0061FF;
  padding: 0 24px;
  font-size: 14px;
  min-width: 64px;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.c_pub_button_confirm:hover {
  background-color: #3681FC !important;
}

.c_pub_button_confirm + .c_pub_button_confirm {
  margin-left: 20px;
}

.c_pub_button_add {
  color: #0061FF;
  background-color: #fff;
  border: 1.5px solid #0061FF;
  padding: 0 12px;
  font-size: 14px;
  min-width: 64px;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.c_pub_button_add:hover {
  background: #E0EAFB !important;
  /* background-color: #f0f4fa !important; */
}

.c_pub_button_add + .c_pub_button_add {
  margin-left: 20px;
}


.c_pub_button_return {
  color: #060E17;
  background-color: #F0F4FA;
  border: 1.5px solid #CAD1DC;
  padding: 0 24px;
  font-size: 14px;
  min-width: 64px;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.c_pub_button_return:hover {
  /* background-color: #e1e5ea !important; */
  /* background-color: #dbdbdb !important; */
  background: #CAD1DC !important;
}

.c_pub_button_return + .c_pub_button_return {
  margin-left: 20px;
}

.c_pub_button_return + .c_pub_button_confirm {
  margin-left: 20px;
}

.c_pub_button_delete {
  color: #717c8d;
  background-color: #e7ebf1;
  padding: 0 24px;
  font-size: 14px;
  min-width: 64px;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.c_pub_button_delete:hover {
  background-color: #e1e5ea !important;
}

.c_pub_button_delete + .c_pub_button_delete {
  margin-left: 20px;
}

.c_pub_button_delete + .c_pub_button_confirm {
  margin-left: 15px;
}

.pub_btn_template_img::before,
.pub_btn_add_img2::before,
.pub_btn_eval_img::before,
.pub_btn_eval_source_img::before,
.pub_btn_tool_img::before,
.pub_btn_add_task_img::before,
.pub_btn_finish_img::before,
.pub_btn_last_img::before,
.pub_btn_next_img::before,
.pub_btn_return_img::before,
.pub_btn_delete_img::before,
.pub_btn_paste_img::before,
.pub_btn_add_img::before {
  content: "";
  width: 17px;
  height: 17px;
  min-width: 17px;
  min-height: 17px;
  background-size: 100% 100%;
  display: block;
  margin-right: 7px;
}

.pub_btn_add_img::before {
  width: 20px;
  height: 20px;
  background-image: url(../icon/new/addStage.png);
}

.pub_btn_template_img::before{
  background-image: url(../icon/new/icon_template.png);
}

.pub_btn_add_img2::before {
  background-image: url(../icon/new/icon_add.png);
}

.pub_btn_paste_img::before {
  /* background-image: url(../icon/new/icon_paste.png); */
  background-image: url(../icon/new/aiPaste.png);
}

.pub_btn_finish_img::before {
  background-image: url(../icon/new/icon_finish.png);
}

.pub_btn_last_img::before {
  transform: rotate(180deg);
  background-image: url(../icon/new/icon_last.png);
  /* background-image: url(../icon/new/icon_last.png); */
}

.pub_btn_next_img::before {
  background-image: url(../icon/new/icon_next.png);
}

.pub_btn_return_img::before {
  background-image: url(../icon/new/icon_return.png);
}

.pub_btn_delete_img::before {
  background-image: url(../icon/new/delete_u.png);
}

.pub_btn_add_task_img::before {
  background-image: url(../icon/new/icon_addTask.png);
}

.pub_btn_tool_img::before {
  background-image: url(../icon/new/course_icon_tool.png);
}

.pub_btn_eval_img::before {
  background-image: url(../icon/new/icon_setting.png);
}

.pub_btn_eval_source_img::before{
  background-image: url(../icon/new/icon_setting.png);
}

.r_pub_button_edit,
.r_pub_button_op,
.r_pub_button_retrun {
  color: #0061FF;
  font-size: 14px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.r_pub_button_retrun::before {
  content: "";
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  background-size: 100% 100%;
  display: block;
  margin-right: 7px;
  background-image: url(../icon/new/icon_return2.png);
}

.r_pub_button_op::before {
  content: "";
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  background-size: 100% 100%;
  display: block;
  margin-right: 7px;
  background-image: url(../icon/new/u_op.png);
}


.r_pub_button_course {
  color: #fff;
  background-color: #0061FF;
  font-size: 16px;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  padding: 12px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  position: relative;
}


.r_pub_button_course::before {
  content: "";
  width: 14px;
  height: 14px;
  min-width: 14px;
  min-height: 14px;
  background-size: 100% 100%;
  display: block;
  margin-right: 7px;
  background-image: url(../icon/new/upload.png);
}


.pub_test_btn {
  color: #101010;
  background-color: rgb(240, 242, 245);
  padding: 8px 10px;
  font-size: 16px;
  min-width: 100px;
  font-weight: 500;
  border-radius: 4px;
  box-sizing: border-box;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: left;
  line-height: 1;
}

/* .pub_test_btn:has(+.pub_test_btn) {
  margin-right: 10px;
} */
.pub_test_btn {
  margin-right: 10px;
}

.pub_test_btn_text::before,
.pub_test_btn_choose::before,
.pub_test_btn_page::before,
.pub_test_btn_group::before,
.pub_test_btn_course::before,
.pub_test_btn_eva::before,
.pub_test_btn_time::before,
.pub_test_btn_file::before {
  content: "";
  width: 18px;
  height: 18px;
  min-width: 14px;
  min-height: 14px;
  background-size: 100% 100%;
  display: block;
  margin-right: 7px;
}


.pub_test_btn_text::before {
  background-image: url(../icon/test/type_text_icon.png);
}
.pub_test_btn_choose::before {
  background-image: url(../icon/test/type_check_icon.png);
}
.pub_test_btn_file::before {
  background-image: url(../icon/test/type_file_icon.png);
}
.pub_test_btn_page::before {
  background-image: url(../icon/test/type_page_icon.png);
}
.pub_test_btn_group::before {
  background-image: url(../icon/test/type_group_icon.png);
}
.pub_test_btn_course::before {
  background-image: url(../icon/test/type_course_icon.png);
}
.pub_test_btn_eva::before {
  background-image: url(../icon/test/type_eva_icon.png);
}
.pub_test_btn_time::before {
  background-image: url(../icon/test/type_time_icon.png);
}

.test_icon{
  display: inline-block;
  width: 18px;
  height: 18px;
  background-size: 100% 100%;
  cursor: pointer;
  position: relative;
  top: 3px;
  margin-right: 5px;
}

.test_icon_check{
  background-image: url('../icon/test/type_check_icon.png');
}
.test_icon_checkO{
  background-image: url('../icon/test/type_checkO_icon.png');
}
.test_icon_gap{
  background-image: url('../icon/test/type_text_icon.png');
}
.test_icon_file{
  background-image: url('../icon/test/type_file_icon.png');
}
.test_course_file{
  background-image: url('../icon/test/type_course_icon.png');
}
.test_eva_file{
  background-image: url('../icon/test/type_eva_icon.png');
}
.test_icon_time{
  background-image: url('../icon/test/type_time_icon.png');
}

.dataBoard_check_box {
  display: flex;
  align-items: center;
  margin: 5px auto;
  width: fit-content;
  height: 35px;
  background: #FFFFFF8C;
  border-radius: 3px;
  font-size: 14px;
  padding: 5px;
  box-sizing: border-box;
}

.dataBoard_check_box>div {
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 12px;
  cursor: pointer;
  color: #00000099;
}

.dataBoard_check_box>.active {
  background: #fff;
}

.dataBoard_check_box>.active>span {
  background-image: linear-gradient(90deg, #3673E8 0%, #AD88FD 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.dataBoard_check_box>.icon::before {
  content: '';
  width: 16px;
  height: 16px;
  background-size: 100% 100%;
  margin-right: 5px;
}

.dataBoard_check_box>.rl_icon::before {
  background-image: url('../icon/dataCheck/rl_icon_data.png');
}

.dataBoard_check_box>.yb_icon::before {
  background-image: url('../icon/dataCheck/yb_icon_data.png');
}

.dataBoard_check_box>.zz_icon::before {
  background-image: url('../icon/dataCheck/zz_icon_data.png');
}

.dataBoard_check_box>.zz_icon2::before {
  background-image: url('../icon/dataCheck/zz_icon_data2.png');
}

.dataBoard_check_box>.sd_icon::before {
  background-image: url('../icon/dataCheck/sd_icon_data.png');
}

.dataBoard_check_box>.ld_icon::before {
  background-image: url('../icon/dataCheck/ld_icon_data.png');
}

.dataBoard_check_box>.djzz_icon::before {
  background-image: url('../icon/dataCheck/djzz_icon_data.png');
}

.dataBoard_check_box>.hx_icon::before {
  background-image: url('../icon/dataCheck/hx_icon_data.png');
}

.dataBoard_check_box>.bz_icon::before {
  background-image: url('../icon/dataCheck/bz_icon_data.png');
}



.dataBoard_check_box>.active.rl_icon::before {
  background-image: url('../icon/dataCheck/rl_icon_data_active.png');
}

.dataBoard_check_box>.active.yb_icon::before {
  background-image: url('../icon/dataCheck/yb_icon_data_active.png');
}

.dataBoard_check_box>.active.zz_icon::before {
  background-image: url('../icon/dataCheck/zz_icon_data_active.png');
}

.dataBoard_check_box>.active.zz_icon2::before {
  background-image: url('../icon/dataCheck/zz_icon_data2_active.png');
}

.dataBoard_check_box>.active.sd_icon::before {
  background-image: url('../icon/dataCheck/sd_icon_data_active.png');
}

.dataBoard_check_box>.active.ld_icon::before {
  background-image: url('../icon/dataCheck/ld_icon_data_active.png');
}

.dataBoard_check_box>.active.djzz_icon::before {
  background-image: url('../icon/dataCheck/djzz_icon_data_active.png');
}

.dataBoard_check_box>.active.hx_icon::before {
  background-image: url('../icon/dataCheck/hx_icon_data_active.png');
}

.dataBoard_check_box>.active.bz_icon::before {
  background-image: url('../icon/dataCheck/bz_icon_data_active.png');
}

.el-table__column-filter-trigger i{
  background-image: url('../icon/test/test_table_arrow.png');
  background-size: 100% 100%;
  width: 15px;
  height: 15px;
}
.el-table__column-filter-trigger i::before{
  content: '';
}