style.css 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. * {
  2. margin: 0;
  3. padding: 0;
  4. box-sizing: border-box;
  5. }
  6. :root,
  7. [data-theme="light"] {
  8. --bg: #f5f5f5;
  9. --header-bg: #ffffff;
  10. --content-bg: #f0f0f0;
  11. --card-bg: #ffffff;
  12. --card-bg-secondary: #fafafa;
  13. --text-color: #1f1f1f;
  14. --text-secondary: #8c8c8c;
  15. --border-color: #e8e8e8;
  16. --sider-bg: #001529;
  17. }
  18. [data-theme="dark"] {
  19. --bg: #000000;
  20. --header-bg: #141414;
  21. --content-bg: #1f1f1f;
  22. --card-bg: #141414;
  23. --card-bg-secondary: #1f1f1f;
  24. --text-color: #d9d9d9;
  25. --text-secondary: #8c8c8c;
  26. --border-color: #303030;
  27. --sider-bg: #141414;
  28. }
  29. body {
  30. background: var(--bg);
  31. color: var(--text-color);
  32. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  33. }
  34. #app {
  35. width: 100%;
  36. min-height: 100vh;
  37. }
  38. .ant-layout-sider {
  39. background: var(--sider-bg) !important;
  40. }
  41. .ant-layout-header {
  42. background: var(--header-bg) !important;
  43. }
  44. .ant-table-wrapper .ant-table {
  45. background: var(--card-bg);
  46. }
  47. .ant-card {
  48. background: var(--card-bg);
  49. border-color: var(--border-color);
  50. }
  51. .ant-modal-content {
  52. background: var(--content-bg);
  53. }
  54. .ant-modal-header {
  55. background: var(--content-bg);
  56. }
  57. .ant-drawer-content {
  58. background: var(--content-bg);
  59. }
  60. .ant-drawer-header {
  61. background: var(--content-bg);
  62. }
  63. .ant-form-item-label > label {
  64. color: var(--text-color);
  65. }
  66. .ant-input,
  67. .ant-input-password,
  68. .ant-select-selector {
  69. background: var(--card-bg) !important;
  70. border-color: var(--border-color) !important;
  71. color: var(--text-color) !important;
  72. }
  73. .ant-statistic-title {
  74. color: var(--text-secondary);
  75. }
  76. .ant-statistic-content {
  77. color: var(--text-color);
  78. }
  79. .ant-empty-description {
  80. color: var(--text-secondary);
  81. }
  82. .ant-tag {
  83. border: none;
  84. margin-inline-end: 0;
  85. }
  86. .ant-badge-status-dot {
  87. width: 8px;
  88. height: 8px;
  89. }