dark.scss 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. html.dark {
  2. /* 自定义深色背景颜色 */
  3. --el-bg-color: #262727;
  4. --font-color: #fff;
  5. --el-menu-text-color: #fff;
  6. --el-menu-hover-text-color: #fff;
  7. --el-menu-bg-color: var(--el-bg-color);
  8. --el-menu-hover-bg-color: var(--el-bg-color);
  9. --el-menu-active-color: #ffd04b;
  10. --el-menu-level: 0;
  11. .el-header {
  12. background-color: var(--el-bg-color);
  13. }
  14. .home-container .el-header {
  15. box-shadow: 0px 0px 5px rgba(255, 255, 255, 1);
  16. }
  17. .el-main {
  18. color: var(--font-color);
  19. background-color: var(--el-bg-color);
  20. .table-header {
  21. background-color: var(--el-bg-color);
  22. }
  23. .el-table__body tr.el-table__row {
  24. background-color: var(--el-bg-color) !important;
  25. }
  26. .el-table__body tr.el-table__row:hover {
  27. // box-shadow: 0 0 6px #fff;
  28. // background-color: var(--el-bg-color) !important;
  29. box-shadow: 0px 0px 10px rgba(255, 255, 255, 1) inset, 0px 0px 5px rgba(200, 200, 200, 1);
  30. }
  31. .el-table .el-table__row {
  32. color: var(--font-color);
  33. font-weight: 600;
  34. }
  35. .records {
  36. .info-content,
  37. .content {
  38. color: var(--font-color) !important;
  39. }
  40. .content {
  41. background-color: var(--el-bg-color);
  42. }
  43. }
  44. .RecordsFinance .RecordsFinance-container .info-content,
  45. .Leave .Leave-container .info-content,
  46. .salary .info-content {
  47. color: var(--font-color) !important;
  48. }
  49. }
  50. .home-container .el-aside {
  51. background-color: var(--el-bg-color);
  52. .menu .el-menu {
  53. color: var(--font-color);
  54. background-color: var(--el-bg-color);
  55. .el-sub-menu .el-sub-menu__title {
  56. color: var(--font-color) !important;
  57. background-color: var(--el-bg-color) !important;
  58. }
  59. .el-menu-item:hover {
  60. background-color: rgba(14, 17, 31, 0.5);
  61. }
  62. }
  63. }
  64. .el-button {
  65. background-color: var(--el-bg-color);
  66. }
  67. }