压缩二维码大小和空间，确保一个屏幕显示所有信息

certificate.html

@@ -1134,10 +1134,10 @@
       const qrContainer = document.createElement('div');
       qrContainer.id = 'qrCodeDisplay';
       qrContainer.style.cssText = `
-        margin: 20px 0 10px;
-        padding: 16px;
+        margin: 10px 0;
+        padding: 10px;
         background-color: #f8f9fa;
-        border-radius: 8px;
+        border-radius: 6px;
         text-align: center;
       `;
       
@@ -1145,8 +1145,8 @@
       const qrTitle = document.createElement('h3');
       qrTitle.style.cssText = `
         color: #28a745;
-        margin-bottom: 10px;
-        font-size: 16px;
+        margin-bottom: 8px;
+        font-size: 14px;
       `;
       qrTitle.innerHTML = '📋 合格证二维码';
       
@@ -1154,12 +1154,12 @@
       const qrImage = document.createElement('img');
       qrImage.id = 'qrCodeImage';
       qrImage.style.cssText = `
-        max-width: 180px;
-        max-height: 180px;
-        margin-bottom: 10px;
+        max-width: 140px;
+        max-height: 140px;
+        margin-bottom: 8px;
         background-color: white;
-        padding: 8px;
-        border-radius: 6px;
+        padding: 6px;
+        border-radius: 4px;
         border: 1px solid #e0e0e0;
       `;
       
@@ -1167,14 +1167,14 @@
       const qrText = document.createElement('div');
       qrText.style.cssText = `
         color: #666;
-        font-size: 12px;
+        font-size: 11px;
         text-align: center;
-        line-height: 1.4;
+        line-height: 1.3;
       `;
-      qrText.innerHTML = '<p style="margin-bottom: 4px;">扫描二维码查看完整信息</p><p>长按保存二维码</p>';
+      qrText.innerHTML = '<p style="margin-bottom: 2px;">扫描查看完整信息</p><p>长按保存二维码</p>';
       
       // 使用Google Charts API生成二维码
-      const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=180x180&data=${encodeURIComponent(url)}`;
+      const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=140x140&data=${encodeURIComponent(url)}`;
       qrImage.src = qrCodeUrl;
       
       // 组装容器

view.html

@@ -338,10 +338,10 @@
       const qrContainer = document.createElement('div');
       qrContainer.id = 'qrCodeDisplay';
       qrContainer.style.cssText = `
-        margin: 20px 0 10px;
-        padding: 16px;
+        margin: 10px 0;
+        padding: 10px;
         background-color: #f8f9fa;
-        border-radius: 8px;
+        border-radius: 6px;
         text-align: center;
       `;
       
@@ -349,8 +349,8 @@
       const qrTitle = document.createElement('h3');
       qrTitle.style.cssText = `
         color: #28a745;
-        margin-bottom: 10px;
-        font-size: 16px;
+        margin-bottom: 8px;
+        font-size: 14px;
       `;
       qrTitle.innerHTML = '📋 合格证二维码';
       
@@ -358,12 +358,12 @@
       const qrImage = document.createElement('img');
       qrImage.id = 'qrCodeImage';
       qrImage.style.cssText = `
-        max-width: 180px;
-        max-height: 180px;
-        margin-bottom: 10px;
+        max-width: 140px;
+        max-height: 140px;
+        margin-bottom: 8px;
         background-color: white;
-        padding: 8px;
-        border-radius: 6px;
+        padding: 6px;
+        border-radius: 4px;
         border: 1px solid #e0e0e0;
       `;
       
@@ -371,14 +371,14 @@
       const qrText = document.createElement('div');
       qrText.style.cssText = `
         color: #666;
-        font-size: 12px;
+        font-size: 11px;
         text-align: center;
-        line-height: 1.4;
+        line-height: 1.3;
       `;
-      qrText.innerHTML = '<p style="margin-bottom: 4px;">扫描二维码查看完整信息</p><p>长按保存二维码</p>';
+      qrText.innerHTML = '<p style="margin-bottom: 2px;">扫描查看完整信息</p><p>长按保存二维码</p>';
       
       // 使用Google Charts API生成二维码
-      const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=180x180&data=${encodeURIComponent(viewUrl)}`;
+      const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=140x140&data=${encodeURIComponent(viewUrl)}`;
       qrImage.src = qrCodeUrl;
       
       // 组装容器