From a593a8b22f384467d0ae10df2b022d61b0cea88c Mon Sep 17 00:00:00 2001 From: aaron <> Date: Wed, 4 Feb 2026 10:41:29 +0800 Subject: [PATCH] update --- frontend/css/style.css | 140 ++++++++++++++++++++++++++++++++++++++--- frontend/index.html | 37 +++++++++-- frontend/js/app.js | 25 ++++---- 3 files changed, 176 insertions(+), 26 deletions(-) diff --git a/frontend/css/style.css b/frontend/css/style.css index 9ff75b9..0fef21c 100644 --- a/frontend/css/style.css +++ b/frontend/css/style.css @@ -579,8 +579,8 @@ html, body { box-shadow: 0 0 0 1px var(--accent); } -/* Author Info */ -.author-info { +/* Footer Info */ +.footer-info { display: flex; align-items: center; justify-content: center; @@ -591,25 +591,23 @@ html, body { letter-spacing: 0.5px; } -.author-label { +.copyright { color: var(--text-secondary); - text-transform: uppercase; } -.author-divider { +.footer-divider { color: var(--border-bright); } -.author-contact { +.contact-link { color: var(--accent); - font-family: 'Monaco', 'Courier New', monospace; cursor: pointer; transition: all 0.2s; padding: 4px 8px; - border-radius: 2px; + border-radius: 4px; } -.author-contact:hover { +.contact-link:hover { background: var(--accent-dim); box-shadow: 0 0 8px var(--accent-dim); } @@ -818,3 +816,127 @@ html, body { border: 1px solid var(--border); border-radius: 2px; } + +/* Contact Modal */ +.contact-modal { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: rgba(0, 0, 0, 0.8); + display: flex; + align-items: center; + justify-content: center; + z-index: 10000; + padding: 20px; + animation: fadeIn 0.2s ease; +} + +.contact-modal-content { + position: relative; + background: var(--bg-primary); + border: 1px solid var(--border-bright); + border-radius: 8px; + padding: 32px; + max-width: 400px; + width: 100%; + box-shadow: 0 8px 32px rgba(0, 255, 65, 0.15); +} + +.contact-modal-content .modal-close-btn { + position: absolute; + top: 16px; + right: 16px; + width: 32px; + height: 32px; + background: transparent; + border: 1px solid var(--border); + border-radius: 4px; + color: var(--text-secondary); + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + transition: all 0.2s; +} + +.contact-modal-content .modal-close-btn:hover { + background: var(--accent-dim); + border-color: var(--accent); + color: var(--accent); +} + +.contact-title { + font-size: 20px; + font-weight: 600; + color: var(--text-primary); + margin: 0 0 24px 0; + text-align: center; +} + +.contact-info { + display: flex; + flex-direction: column; + gap: 16px; + margin-bottom: 20px; +} + +.contact-item { + display: flex; + align-items: center; + gap: 12px; + padding: 12px; + background: var(--bg-secondary); + border: 1px solid var(--border); + border-radius: 6px; + color: var(--text-secondary); + font-size: 14px; +} + +.contact-item svg { + color: var(--accent); + flex-shrink: 0; +} + +.contact-item strong { + color: var(--accent); + font-family: 'Monaco', 'Courier New', monospace; + font-weight: 600; +} + +.copy-btn { + width: 100%; + padding: 12px; + background: var(--accent-dim); + border: 1px solid var(--accent); + border-radius: 6px; + color: var(--accent); + font-size: 14px; + font-weight: 500; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + transition: all 0.2s; +} + +.copy-btn:hover { + background: var(--accent); + color: var(--bg-primary); + box-shadow: 0 0 12px var(--accent-dim); +} + +.copy-btn svg { + flex-shrink: 0; +} + +.contact-hint { + text-align: center; + color: var(--text-tertiary); + font-size: 12px; + margin: 0; + padding-top: 12px; + border-top: 1px solid var(--border); +} diff --git a/frontend/index.html b/frontend/index.html index 7144887..b061f56 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -140,11 +140,9 @@ - -
@@ -162,6 +160,35 @@长按图片可保存到相册
+ + +