数据可视化大屏
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

92 lines
1.6KB

  1. .dashboard-container {
  2. width: 20rem;
  3. height: 10rem;
  4. margin-top: -3rem;
  5. margin-bottom: -2rem;
  6. }
  7. .sys-status-title {
  8. font-size: 18px;
  9. font-weight: 600;
  10. color: #94DDF3;
  11. text-align: center;
  12. }
  13. .ag-theme-datav {
  14. --ag-border-color: #74FAFB;
  15. --ag-foreground-color: #74FAFB;
  16. --ag-background-color: #0A1632;
  17. --ag-header-foreground-color: #74FAFB;
  18. --ag-header-background-color: #0A1632;
  19. --ag-odd-row-background-color: #0A1632;
  20. --ag-header-column-resize-handle-color: rgb(126 46 132);
  21. --ag-font-size: 17px;
  22. --ag-font-family: monospace;
  23. height: 5rem;
  24. }
  25. .centered-element {
  26. display: flex;
  27. align-items: center;
  28. justify-content: center;
  29. height: 100%;
  30. }
  31. .status-container {
  32. display: flex;
  33. align-items: center;
  34. padding: 0.5rem;
  35. }
  36. .status-circle {
  37. width: 18px;
  38. height: 18px;
  39. border-radius: 50%;
  40. &.red {
  41. background-color: red;
  42. }
  43. &.green {
  44. background-color: green;
  45. }
  46. }
  47. .progress-container {
  48. display: flex;
  49. color: white;
  50. .status-text {
  51. width: 8rem;
  52. margin-left: 6px;
  53. /* 调整文字与圆形之间的间距 */
  54. font-size: 16px;
  55. font-weight: 600;
  56. color: #74FAFB;
  57. }
  58. .status-ext-text {
  59. margin-top: 3px;
  60. /* 将文本转换为行内块元素 */
  61. font-size: 12px;
  62. }
  63. }
  64. .progress-display {
  65. color: white;
  66. text-align: right;
  67. }
  68. .statistic-item-container {
  69. display: flex;
  70. padding: 1rem 0;
  71. color: white;
  72. }
  73. .white-color-theme {
  74. color: #74FAFB;
  75. }