system.css 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. body {
  2. background-color: #F5F6FA;
  3. font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  4. }
  5. .nav-bar {
  6. position: fixed;
  7. top: 0;
  8. left: 0;
  9. width: 100%;
  10. height: 2.75rem;
  11. padding-top: var(--status-bar-height);
  12. background-color: #fff;
  13. display: flex;
  14. align-items: center;
  15. justify-content: space-between;
  16. padding: 0 0.9375rem;
  17. box-sizing: border-box;
  18. z-index: 100;
  19. }
  20. .nav-placeholder {
  21. height: calc(2.75rem + var(--status-bar-height));
  22. }
  23. .back-icon {
  24. width: 1.25rem;
  25. height: 1.25rem;
  26. }
  27. .nav-title {
  28. font-size: 1.0625rem;
  29. font-weight: bold;
  30. color: #333;
  31. }
  32. .nav-right { width: 1.25rem;
  33. }
  34. .sys-msg-list {
  35. padding: 0.625rem 0.9375rem;
  36. }
  37. .date-label {
  38. text-align: center;
  39. font-size: 0.75rem;
  40. color: #ccc;
  41. margin: 0.9375rem 0 0.625rem; /* Increased top margin */
  42. }
  43. .sys-card {
  44. background-color: #fff;
  45. border-radius: 0.5rem;
  46. padding: 0.9375rem;
  47. margin-bottom: 0.625rem;
  48. box-shadow: 0 0.0625rem 0.25rem rgba(0,0,0,0.02);
  49. }
  50. .sys-header {
  51. display: flex;
  52. align-items: center;
  53. margin-bottom: 0.5rem;
  54. }
  55. .sys-title {
  56. font-size: 0.875rem;
  57. font-weight: bold;
  58. color: #333;
  59. }
  60. .red-dot {
  61. width: 0.3125rem;
  62. height: 0.3125rem;
  63. background-color: #FF3B30;
  64. border-radius: 50%;
  65. margin-left: 0.3125rem;
  66. }
  67. .sys-content {
  68. margin-bottom: 0.75rem;
  69. }
  70. .sys-text {
  71. font-size: 0.8125rem;
  72. color: #666;
  73. line-height: 1.6;
  74. }
  75. .sys-footer {
  76. display: flex;
  77. justify-content: space-between;
  78. align-items: center;
  79. border-top: 0.03125rem solid #f5f5f5;
  80. padding-top: 0.625rem;
  81. }
  82. .sys-time {
  83. font-size: 0.75rem;
  84. color: #999;
  85. }
  86. .check-more {
  87. display: flex;
  88. align-items: center;
  89. font-size: 0.75rem;
  90. color: #999;
  91. }
  92. .arrow-icon-small {
  93. width: 0.625rem;
  94. height: 0.625rem;
  95. margin-left: 0.125rem;
  96. opacity: 0.5;
  97. }