From 43f05a6e345d772ba66728259835d5e949665bd3 Mon Sep 17 00:00:00 2001 From: HenryDu8133 <813367384@qq.com> Date: Fri, 18 Sep 2026 22:15:09 +0800 Subject: [PATCH] =?UTF-8?q?fix(ui):=20=E9=80=82=E9=85=8D=E5=89=8D=E5=8F=B0?= =?UTF-8?q?=E6=B5=85=E8=89=B2=E8=83=8C=E6=99=AF=E7=BB=86=E8=8A=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 学校 logo 替换为黑字版本，修改 useSiteConfig 默认值和 fallback - 首页通知卡片补齐浅色样式：status-tag（三态）、unread-indicator、 invite-actions、accept-btn、reject-btn - 投稿区域状态徽章由绝对定位改为搜索标题行内布局，背景改为浅色 - 消息设置页面整体改为浅色主题，主色系改为 indigo 以匹配 ModernLight --- app/components/Songs/RequestForm.vue | 132 +++++++++++++++----------- app/composables/useSiteConfig.js | 4 +- app/pages/index.vue | 87 +++++++++++++++++ app/pages/notification-settings.vue | 136 +++++++++++++-------------- public/images/school-logo-black.png | Bin 165705 -> 881298 bytes 5 files changed, 234 insertions(+), 125 deletions(-) diff --git a/app/components/Songs/RequestForm.vue b/app/components/Songs/RequestForm.vue index 5be91bd..20394a7 100644 --- a/app/components/Songs/RequestForm.vue +++ b/app/components/Songs/RequestForm.vue @@ -56,42 +56,46 @@
-
-
-
- {{ submissionStatus.submissionClosed ? '投稿未开放' : '投稿开放中' }} -
-
- - -
-
-
-
-
歌曲搜索
+
+
歌曲搜索
+
+
+
+ {{ submissionStatus.submissionClosed ? '投稿未开放' : '投稿开放中' }} +
+
+ + +
+
+
+
{ siteConfig.value = { siteTitle: '校园广播站点歌系统', siteLogoUrl: '/images/site-logo.png', - schoolLogoHomeUrl: '/images/school-logo-white.png', + schoolLogoHomeUrl: '/images/school-logo-black.png', schoolLogoPrintUrl: '/images/school-logo-transparent.png', siteDescription: '校园广播站点歌系统 - 让你的声音被听见', siteVersion: '', @@ -81,7 +81,7 @@ export const useSiteConfig = () => { }) const schoolLogoHomeUrl = computed(() => { const raw = (siteConfig.value.schoolLogoHomeUrl || '').trim() - const fallback = '/images/school-logo-white.png' + const fallback = '/images/school-logo-black.png' if (!raw) return fallback if (raw === '/images/school-logo-white.png' || raw === '/images/school-logo-black.png') return fallback diff --git a/app/pages/index.vue b/app/pages/index.vue index 4c4a995..5582382 100644 --- a/app/pages/index.vue +++ b/app/pages/index.vue @@ -3781,4 +3781,91 @@ if ( transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0, 67, 248, 0.3); } + +.status-tag { + display: inline-block; + margin-left: 6px; + padding: 2px 8px; + font-size: 10px; + font-weight: 700; + border-radius: 6px; + letter-spacing: 0.02em; +} + +.status-tag.accepted { + background: var(--success-light, rgba(22, 163, 74, 0.1)); + color: var(--success, #16a34a); + border: 1px solid var(--success-border, rgba(22, 163, 74, 0.2)); +} + +.status-tag.rejected { + background: var(--error-light, rgba(225, 29, 72, 0.1)); + color: var(--error, #e11d48); + border: 1px solid var(--error-border, rgba(225, 29, 72, 0.2)); +} + +.status-tag.invalid { + background: var(--warning-light, rgba(234, 88, 12, 0.1)); + color: var(--warning, #ea580c); + border: 1px solid var(--warning-border, rgba(234, 88, 12, 0.2)); +} + +.unread-indicator { + display: inline-block; + width: 6px; + height: 6px; + margin-left: 8px; + vertical-align: middle; + background: var(--primary, #4f46e5); + border-radius: 50%; + box-shadow: 0 0 0 2px var(--primary-light, rgba(79, 70, 229, 0.2)); +} + +.invite-actions { + display: flex; + gap: 10px; + margin-top: 12px; +} + +.action-button { + display: inline-flex; + align-items: center; + gap: 6px; + padding: 8px 14px; + font-size: 12px; + font-weight: 600; + border-radius: 10px; + border: 1px solid transparent; + cursor: pointer; + transition: all 0.2s ease; +} + +.action-button:disabled { + opacity: 0.5; + cursor: not-allowed; +} + +.action-button.accept-btn { + background: var(--success-light, rgba(22, 163, 74, 0.1)); + color: var(--success, #16a34a); + border-color: var(--success-border, rgba(22, 163, 74, 0.2)); +} + +.action-button.accept-btn:hover:not(:disabled) { + background: var(--success, #16a34a); + color: #ffffff; + border-color: var(--success, #16a34a); +} + +.action-button.reject-btn { + background: var(--bg-secondary, #f4f4f5); + color: var(--text-secondary, #3f3f46); + border-color: var(--border-primary, #e4e4e7); +} + +.action-button.reject-btn:hover:not(:disabled) { + background: var(--error-light, rgba(225, 29, 72, 0.1)); + color: var(--error, #e11d48); + border-color: var(--error-border, rgba(225, 29, 72, 0.2)); +} diff --git a/app/pages/notification-settings.vue b/app/pages/notification-settings.vue index e318150..e4cd85a 100644 --- a/app/pages/notification-settings.vue +++ b/app/pages/notification-settings.vue @@ -1,19 +1,19 @@