From 2db62f9b9ec490d4d29a2c047f18e1d6ea8ab29e Mon Sep 17 00:00:00 2001 From: baoweise-bot Date: Fri, 5 Jun 2026 21:12:22 +0800 Subject: [PATCH] refactor: rename ad-related UI components and styles to vps-recommend naming convention --- vpngate_manager.py | 163 ++++++++++++++++----------------------------- 1 file changed, 59 insertions(+), 104 deletions(-) diff --git a/vpngate_manager.py b/vpngate_manager.py index 675d7c5..4e401da 100644 --- a/vpngate_manager.py +++ b/vpngate_manager.py @@ -2076,7 +2076,7 @@ INDEX_HTML = r""" min-width: 320px; margin-bottom: 0 !important; } - .vps-promo-tab { + .vps-recommend-tab { position: fixed; right: 0; top: 50%; @@ -2103,77 +2103,51 @@ INDEX_HTML = r""" justify-content: center; gap: 4px; } - .vps-promo-tab:hover { + .vps-recommend-tab:hover { padding-right: 10px; box-shadow: -4px 0 25px rgba(99, 102, 241, 0.5); } - .ad-section { - background: var(--bg-surface); - backdrop-filter: blur(12px); - -webkit-backdrop-filter: blur(12px); - border: 1px solid var(--border-color); - border-radius: 16px; - padding: 20px; - margin-bottom: 24px; - } - - .ad-card { - display: flex; - flex-direction: column; - gap: 16px; - } - - .ad-title { - font-size: 15px; - font-weight: 700; - color: var(--text-primary); - display: flex; - align-items: center; - gap: 8px; - } - - .ad-badge { - background: var(--primary-gradient); - color: white; - font-size: 11px; - padding: 3px 8px; - border-radius: 6px; - font-weight: 700; - text-transform: uppercase; - box-shadow: 0 2px 6px rgba(99, 102, 241, 0.3); - } - - .ad-links { + .vps-links { display: grid; - grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + grid-template-columns: repeat(2, 1fr); gap: 16px; } - .ad-item { + @media (max-width: 576px) { + .vps-links { + grid-template-columns: 1fr; + } + } + + .vps-item { background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(255, 255, 255, 0.04); - border-radius: 10px; - padding: 16px; + border-radius: 12px; + padding: 20px; display: flex; flex-direction: column; - gap: 12px; + gap: 14px; justify-content: space-between; - transition: all 0.2s ease; + transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); } - .ad-item:hover { - background: rgba(255, 255, 255, 0.04); - border-color: var(--border-color-hover); + .vps-item:hover { + background: rgba(255, 255, 255, 0.05); + border-color: rgba(99, 102, 241, 0.3); transform: translateY(-2px); + box-shadow: 0 8px 30px rgba(99, 102, 241, 0.1); } - .ad-tag { + .vps-tag { font-size: 11px; font-weight: 700; - padding: 3px 8px; + padding: 4px 10px; border-radius: 6px; width: fit-content; + text-transform: uppercase; + letter-spacing: 0.5px; } .tag-normal { @@ -2182,47 +2156,41 @@ INDEX_HTML = r""" border: 1px solid rgba(99, 102, 241, 0.2); } - .tag-opt { - background: rgba(245, 158, 11, 0.15); - color: #fde047; - border: 1px solid rgba(245, 158, 11, 0.2); - } - .tag-premium { background: rgba(16, 185, 129, 0.15); color: #6ee7b7; border: 1px solid rgba(16, 185, 129, 0.2); } - .ad-desc { + .vps-desc { font-size: 13px; color: var(--text-secondary); - line-height: 1.5; + line-height: 1.6; flex: 1; } - .ad-btn { - align-self: flex-start; + .vps-btn { + align-self: stretch; text-decoration: none; - background: rgba(255, 255, 255, 0.06); + background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.08); color: var(--text-primary); font-size: 12px; font-weight: 600; - padding: 6px 14px; - border-radius: 6px; + padding: 8px 16px; + border-radius: 8px; transition: all 0.2s ease; text-align: center; } - .ad-item:hover .ad-btn { + .vps-item:hover .vps-btn { background: var(--primary-gradient); border-color: transparent; color: white; box-shadow: 0 4px 10px rgba(99, 102, 241, 0.2); } - .ad-footer { + .vps-footer { border-top: 1px dashed rgba(255, 255, 255, 0.08); padding-top: 12px; font-size: 13px; @@ -2763,12 +2731,6 @@ INDEX_HTML = r""" - @@ -2777,7 +2739,12 @@ INDEX_HTML = r""" - +