// 暗黑模式作用域
.darkTheme{
// 列表
.el-table {
background: transparent !important;
color: #fff;
// 单数行
tr:nth-child(odd) {
background: #021132;
}
// 偶数行
tr:nth-child(even) {
background: #021132;
}
//间隔线条
th.is-leaf,
td {
border-bottom: 1px solid rgba($color: #0CA8E3, $alpha: 0.3);
}
&::before {
background: #000;
}
tr th{
color: #fff;
background: rgba($color: #023053, $alpha: 0.7);
}
}
//覆盖悬浮效果
.el-table__body tr.hover-row >td{
background: rgba($color: #023053, $alpha: 0.3) !important;
}
//其他表格的覆盖效果 我也不知道为啥还不一样
.el-table__body tr:hover > td{
background: rgba($color: #023053, $alpha: 0.3) !important;
}
//去左下角白线
.el-table__fixed::before{
background: rgba($color: #000000, $alpha: 0) !important;
}
// 更改大背景颜色
.back_f3f6fa {
background-color: #021133 !important;
}
//内阴影边框
.darkBorderStyle {
border: 1px solid #0CA8E3;
box-shadow: inset 0px 0px 14px 2px #0CA8E3;
background-color: #021132;
color: #fff;
}
//只有内阴影
.darkBorderStyleOnlyBorder {
border: 1px solid #0CA8E3;
}
//字体hover
.el-link{
color: #fff;
}
}
效果前后对比: