diff --git a/certificate.html b/certificate.html index 6b07d6b..5b53e3d 100644 --- a/certificate.html +++ b/certificate.html @@ -94,8 +94,8 @@ } .certificate { - margin: 16px; - padding: 16px; + margin: 12px; + padding: 12px; background-color: white; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); @@ -109,7 +109,7 @@ color: #28a745; padding: 8px 12px; border-radius: 4px; - margin-bottom: 16px; + margin-bottom: 10px; font-weight: 500; } @@ -126,17 +126,17 @@ } .promise-text { - margin-bottom: 20px; + margin-bottom: 10px; line-height: 1.6; } .promise-item { - margin-top: 8px; + margin-top: 4px; padding-left: 20px; } .info-item { - padding: 10px 0; + padding: 6px 0; border-bottom: 1px solid #f0f0f0; display: flex; align-items: flex-start; @@ -386,12 +386,15 @@ } /* 签名显示样式 */ + .signature-display { + margin-left: 30px; + } .signature-display img { - max-width: 250px; - max-height: 120px; + max-width: 180px; + max-height: 90px; border: 1px solid #e0e0e0; border-radius: 4px; - padding: 8px; + padding: 6px; background-color: white; } @@ -1134,8 +1137,8 @@ const qrContainer = document.createElement('div'); qrContainer.id = 'qrCodeDisplay'; qrContainer.style.cssText = ` - margin: 10px 0; - padding: 10px; + margin: 8px 0; + padding: 8px; background-color: #f8f9fa; border-radius: 6px; text-align: center; @@ -1145,8 +1148,8 @@ const qrTitle = document.createElement('h3'); qrTitle.style.cssText = ` color: #28a745; - margin-bottom: 8px; - font-size: 14px; + margin-bottom: 6px; + font-size: 13px; `; qrTitle.innerHTML = '📋 合格证二维码'; @@ -1154,11 +1157,11 @@ const qrImage = document.createElement('img'); qrImage.id = 'qrCodeImage'; qrImage.style.cssText = ` - max-width: 140px; - max-height: 140px; - margin-bottom: 8px; + max-width: 120px; + max-height: 120px; + margin-bottom: 6px; background-color: white; - padding: 6px; + padding: 4px; border-radius: 4px; border: 1px solid #e0e0e0; `; @@ -1167,11 +1170,12 @@ const qrText = document.createElement('div'); qrText.style.cssText = ` color: #666; - font-size: 11px; + font-size: 10px; text-align: center; - line-height: 1.3; + line-height: 1.2; `; - qrText.innerHTML = '
扫描查看完整信息
长按保存二维码
'; + qrText.innerHTML = '扫描查看完整信息
长按保存二维码
'; + // 使用Google Charts API生成二维码 const qrCodeUrl = `https://api.qrserver.com/v1/create-qr-code/?size=140x140&data=${encodeURIComponent(url)}`;