table.scss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. $bgColor: #1f1f1f; // 背景色
  2. $borderColor: #606266;
  3. $color: #c0c4cc;
  4. // 字体颜色
  5. /deep/ .el-table {
  6. color: $color;
  7. background-color: $bgColor;
  8. }
  9. // 单元格内填充
  10. /deep/ .el-table td,
  11. /deep/ .el-table th {
  12. padding: 10px 0px;
  13. background-color: $bgColor;
  14. }
  15. // 有滚动条时
  16. /deep/ .el-table__fixed-right-patch {
  17. display: none;
  18. width: 0;
  19. height: 0;
  20. }
  21. /deep/ .el-table__fixed-right {
  22. right: 0px !important;
  23. bottom: 0px !important;
  24. }
  25. /deep/ .el-table__fixed-right::before,
  26. /deep/ .el-table__fixed::before {
  27. // display: none;
  28. background-color: $borderColor;
  29. }
  30. // 表头
  31. /deep/ .el-table th,
  32. /deep/ .el-table tr {
  33. background-color: $bgColor;
  34. }
  35. // 表头下划线
  36. /deep/ .el-table__header th {
  37. background-color: $bgColor;
  38. border-color: $borderColor;
  39. color: $color;
  40. }
  41. // 单元格的背景及边框颜色
  42. /deep/ .el-table--enable-row-transition .el-table__body td,
  43. .el-table .cell {
  44. background-color: $bgColor;
  45. border-color: $borderColor;
  46. }
  47. // 表格上、左侧的边框颜色
  48. /deep/ .el-table,
  49. .el-table__expanded-cell {
  50. border-color: $borderColor;
  51. }
  52. // 鼠标悬停背景色
  53. /deep/ .el-table tbody tr:hover > td {
  54. background-color: transparent;
  55. }
  56. // 表格下、右侧的边框颜色
  57. /deep/ .el-table--border::after,
  58. /deep/ .el-table--group::after,
  59. /deep/ .el-table::before {
  60. // display: none;
  61. background-color: $borderColor;
  62. }
  63. // 表格为空
  64. /deep/ .el-table__empty-block {
  65. background-color: $bgColor;
  66. border-color: $borderColor;
  67. }
  68. /** 分页的样式 */
  69. // 前一页、后一页样式
  70. /deep/ .btn-prev,
  71. /deep/ .btn-next {
  72. background-color: #606266;
  73. color: $color;
  74. }
  75. // 页码样式
  76. /deep/ .el-pager {
  77. .number {
  78. background-color: $borderColor;
  79. color: $color;
  80. }
  81. .number.active {
  82. background-color: #409eff;
  83. color: white;
  84. }
  85. .el-icon {
  86. background-color: $borderColor;
  87. color: $color;
  88. }
  89. }
  90. // 前往多少页的字体样式
  91. /deep/ .el-pagination__total,
  92. /deep/ .el-pagination__jump {
  93. color: $color;
  94. }
  95. // 前往多少页的输入框
  96. /deep/ .el-input__inner,
  97. /deep/ .el-textarea__inner,
  98. /deep/ .el-input__count {
  99. background-color: $bgColor;
  100. color: $color;
  101. border-color: $borderColor;
  102. }