feat: 添加页面缩放设置功能并调整样式

exam/index.html

@@ -47,6 +47,8 @@
             <input type="number" id="offset-time" name="offset-time" value="0">
             <label for="room-input">考场号:</label>
             <input type="text" id="room-input" name="room-input" value="">
+            <label for="zoom-input">页面缩放倍数:</label>
+            <input type="number" id="zoom-input" step="0.1" min="0.5" max="2">
             <button id="save-settings-btn">确定</button>
             <button id="close-settings-btn">关闭</button>
         </div>

exam/script.js

@@ -15,9 +15,11 @@ document.addEventListener("DOMContentLoaded", () => {
     const offsetTimeInput = document.getElementById("offset-time");
     const roomInput = document.getElementById("room-input");
     const roomElem = document.getElementById("room");
+    const zoomInput = document.getElementById("zoom-input");
 
     let offsetTime = getCookie("offsetTime") || 0;
     let room = getCookie("room") || "";
+    let zoomLevel = getCookie("zoomLevel") || 1;
 
     offsetTime = parseInt(offsetTime);
     roomElem.textContent = room;
@@ -37,14 +39,11 @@ document.addEventListener("DOMContentLoaded", () => {
 
     function displayExamInfo(data) {
         // Display exam name
-        const prefix = "考试安排";
+        const examNameText = data.examName;
-        const currentText = examNameElem.textContent;
+        const roomText = roomElem.textContent;
-        const newText = `${data.examName}`;
+        examNameElem.innerHTML = `${examNameText} <span id="room">${roomText}</span>`;
-        examNameElem.textContent = currentText.replace(/考试安排.*/, newText);
         // Display message
         messageElem.textContent = data.message;
-        roomElem.style.position = "absolute";
-        roomElem.style.right = "20px";
     }
 
     function updateCurrentTime() {
@@ -149,6 +148,7 @@ document.addEventListener("DOMContentLoaded", () => {
     settingsBtn.addEventListener("click", () => {
         offsetTimeInput.value = offsetTime;
         roomInput.value = room;
+        zoomInput.value = zoomLevel;
         settingsModal.style.display = "block";
     });
 
@@ -161,12 +161,17 @@ document.addEventListener("DOMContentLoaded", () => {
     saveSettingsBtn.addEventListener("click", () => {
         offsetTime = parseInt(offsetTimeInput.value);
         room = roomInput.value;
+        zoomLevel = parseFloat(zoomInput.value);
         setCookie("offsetTime", offsetTime, 365);
         setCookie("room", room, 365);
+        setCookie("zoomLevel", zoomLevel, 365);
         roomElem.textContent = room;
+        document.body.style.zoom = zoomLevel;
         settingsModal.style.display = "none";
     });
 
+    document.body.style.zoom = zoomLevel;
+
     // Utility function to set a cookie
     function setCookie(name, value, days) {
         const d = new Date();

exam/styles.css

@@ -60,10 +60,9 @@ body {
     padding: 20px;
     max-width: 1400px; /* 增加主体部分宽度 */
     margin: auto;
-    background-color: #1f1f1f;
+    background-color: rgba(31, 31, 31, 0.8); /* 使用rgba设置背景透明度 */
     border-radius: 8px;
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
-    opacity: 0.8;
 }
 
 h1 {
@@ -81,8 +80,9 @@ h1 {
     font-size: 3.5rem;
     font-weight: bold;
     color: #e0e0e0;
-    position: absolute;
+    position: relative;
-    right: 20px;
+    right: 0;
+    margin-left: 20px; /* 调整位置使其保持在container中 */
 }
 
 #message {