style.css 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. /* 自定义样式 */
  2. body {
  3. font-size: .875rem;
  4. }
  5. .sidebar {
  6. position: fixed;
  7. top: 0;
  8. bottom: 0;
  9. left: 0;
  10. z-index: 100;
  11. padding: 48px 0 0;
  12. box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
  13. }
  14. .sidebar-sticky {
  15. position: relative;
  16. top: 0;
  17. height: calc(100vh - 48px);
  18. padding-top: .5rem;
  19. overflow-x: hidden;
  20. overflow-y: auto;
  21. }
  22. .sidebar .nav-link {
  23. font-weight: 500;
  24. color: #333;
  25. }
  26. .sidebar .nav-link.active {
  27. color: #007bff;
  28. }
  29. .sidebar-heading {
  30. font-size: .75rem;
  31. text-transform: uppercase;
  32. }
  33. /* 卡片样式 */
  34. .card {
  35. box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
  36. margin-bottom: 1.5rem;
  37. }
  38. .card-header {
  39. background-color: rgba(0, 0, 0, 0.03);
  40. border-bottom: 1px solid rgba(0, 0, 0, 0.125);
  41. }
  42. /* 统计卡片 */
  43. .stats-card {
  44. text-align: center;
  45. padding: 1.5rem;
  46. border-radius: 0.5rem;
  47. color: white;
  48. margin-bottom: 1.5rem;
  49. }
  50. .stats-card.passed {
  51. background: linear-gradient(45deg, #27ae60, #2ecc71);
  52. }
  53. .stats-card.failed {
  54. background: linear-gradient(45deg, #e74c3c, #e67e22);
  55. }
  56. .stats-card.skipped {
  57. background: linear-gradient(45deg, #95a5a6, #7f8c8d);
  58. }
  59. .stats-card.total {
  60. background: linear-gradient(45deg, #3498db, #2980b9);
  61. }
  62. .stats-card .number {
  63. font-size: 2.5rem;
  64. font-weight: bold;
  65. }
  66. .stats-card .label {
  67. font-size: 1rem;
  68. opacity: 0.9;
  69. }
  70. /* 测试用例列表 */
  71. .test-case {
  72. border-left: 4px solid #dee2e6;
  73. padding: 1rem;
  74. margin-bottom: 1rem;
  75. border-radius: 0.25rem;
  76. background-color: #f8f9fa;
  77. }
  78. .test-case.passed {
  79. border-left-color: #27ae60;
  80. }
  81. .test-case.failed {
  82. border-left-color: #e74c3c;
  83. }
  84. .test-case.skipped {
  85. border-left-color: #f39c12;
  86. }
  87. .test-case .test-name {
  88. font-weight: 600;
  89. margin-bottom: 0.5rem;
  90. }
  91. .test-case .test-duration {
  92. color: #6c757d;
  93. font-size: 0.875rem;
  94. }
  95. /* 响应式调整 */
  96. @media (max-width: 767.98px) {
  97. .sidebar {
  98. top: 5rem;
  99. }
  100. }