docs: 页面设计

script.js

@@ -93,7 +93,7 @@ document.addEventListener("DOMContentLoaded", () => {
             currentSubjectElem.textContent = `下一场科目: ${nextExam.name}`;
             examTimingElem.textContent = `起止时间: ${formatTimeWithoutSeconds(new Date(nextExam.start).toLocaleTimeString('zh-CN', { hour12: false }))} - ${formatTimeWithoutSeconds(new Date(nextExam.end).toLocaleTimeString('zh-CN', { hour12: false }))}`;
             remainingTimeElem.textContent = "剩余时间: -";
-            statusElem.textContent = "状态: 即将开始";
+            statusElem.textContent = "状态: 未开始";
             statusElem.style.color = "orange";
         } else {
             currentSubjectElem.textContent = "当前无考试";

styles.css

@@ -2,9 +2,12 @@ body {
     font-family: 'HarmonyOS Sans SC Regular', Arial, sans-serif;
     margin: 0;
     padding: 0;
+    background: url('/background.jpg') no-repeat center center fixed;
+    background-size: cover;
     background-color: #121212;
     animation: fadeIn 1s;
     color: #e0e0e0;
+    overflow: hidden; /* 隐藏滚动条 */
 }
 
 @keyframes fadeIn {
@@ -12,6 +15,16 @@ body {
     to { opacity: 1; }
 }
 
+/* 隐藏滚动条但允许滚动 */
+body::-webkit-scrollbar {
+    display: none;
+}
+
+body {
+    -ms-overflow-style: none;  /* IE 和 Edge */
+    scrollbar-width: none;  /* Firefox */
+}
+
 #fullscreen-btn {
     position: absolute;
     top: 20px;
@@ -56,7 +69,7 @@ body {
     padding: 20px;
     max-width: 1400px; /* 增加主体部分宽度 */
     margin: auto;
-    background-color: #1f1f1f;
+    background-color: rgba(31, 31, 31, 0.8); /* 80% 透明度 */
     border-radius: 8px;
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
 }