From 95832803233ff40a1a6fde67389865aefb56691b Mon Sep 17 00:00:00 2001 From: Megghy Date: Thu, 12 Jun 2025 09:30:43 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=9B=B4=E6=96=B0App.vue=E5=92=8CBiliA?= =?UTF-8?q?uthView.vue=E7=BB=84=E4=BB=B6=EF=BC=8C=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E4=B8=BB=E9=A2=98=E9=A2=9C=E8=89=B2=E5=92=8C=E8=AE=A4=E8=AF=81?= =?UTF-8?q?=E6=B5=81=E7=A8=8B=E7=95=8C=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在App.vue中调整主题颜色设置,提升可读性和对比度 - 在BiliAuthView.vue中重构认证流程界面,增强用户体验,添加响应式设计 - 更新IndexView.vue和ManageLayout.vue中的按钮和提示信息,提升界面一致性 - 在PointUserLayout.vue中优化认证提示信息,明确用户操作步骤 --- src/App.vue | 59 +-- src/views/BiliAuthView.vue | 606 +++++++++++++++++------ src/views/IndexView.vue | 126 +++-- src/views/ManageLayout.vue | 7 +- src/views/pointViews/PointUserLayout.vue | 2 +- 5 files changed, 579 insertions(+), 221 deletions(-) diff --git a/src/App.vue b/src/App.vue index c538e95..9bfa454 100644 --- a/src/App.vue +++ b/src/App.vue @@ -63,45 +63,48 @@ watchEffect(() => { const themeOverrides = computed(() => { return { common: { - // 主色调 (中蓝色基调,调整对比度) - primaryColor: '#5A7A9E', - primaryColorHover: '#7390B1', // 略微提亮悬浮色 - primaryColorPressed: '#4F7094', // 调整按下色,避免在暗色模式下过暗 - primaryColorSuppl: '#8CA6C1', // 调整补充色,使其与背景有区分 + // 主色调 (中蓝色基调,提升可读性并增强对比) + primaryColor: '#4D6E9C', + primaryColorHover: '#6483A9', // 略微提亮悬浮色 + primaryColorPressed: '#365A7D', // 调整按下色,避免在暗色模式下过暗 + primaryColorSuppl: '#809BC1', // 调整补充色,使其与背景有区分 - // 信息色 (浅蓝色基调,调整对比度) - infoColor: '#8CB1C7', // 稍微加深基础信息色 - infoColorHover: '#A6C3D6', // 提亮悬浮色 - infoColorPressed: '#7DA0B5', // 调整按下色 - infoColorSuppl: '#D0DDE8', // 调整补充色 + // 信息色 (浅蓝色基调,提升对比度) + infoColorHover: '#79AFDE', // 提亮悬浮色 + infoColorPressed: '#4B8AC3', // 调整按下色 - // 成功色 (柔和青绿) - successColor: '#4DB6AC', - successColorHover: '#6BC4B9', // 调整悬浮色 - successColorPressed: '#3E9A90', // 调整按下色 - successColorSuppl: '#C1E7E2', // 调整补充色 + // 成功色 (柔和青绿, 增强对比) + successColor: '#3AA89C', + successColorHover: '#5AB9AE', // 调整悬浮色 + successColorPressed: '#2C8C82', // 调整按下色 + successColorSuppl: '#B4E4DF', // 调整补充色 - // 警告色 (柔和橙色) - warningColor: '#FFB74D', - warningColorHover: '#FFC870', // 调整悬浮色 - warningColorPressed: '#F8A830', // 调整按下色 - warningColorSuppl: '#FFE9C7', // 调整补充色 - - // 错误色 (柔和红色) - errorColor: '#E57373', - errorColorHover: '#EC8F8F', // 调整悬浮色 - errorColorPressed: '#D96060', // 调整按下色 - errorColorSuppl: '#F5C7C7', // 调整补充色 + // 警告色 (柔和橙色, 微调对比) + warningColor: '#FFA64D', + warningColorHover: '#FFBA70', // 调整悬浮色 + warningColorPressed: '#E89530', // 调整按下色 + warningColorSuppl: '#FFE2C2', // 调整补充色 + // 错误色 (柔和红色, 微调对比) + errorColor: '#E16565', + errorColorHover: '#EA8282', // 调整悬浮色 + errorColorPressed: '#D44848', // 调整按下色 + errorColorSuppl: '#F3C0C0', // 调整补充色 // 保持字体设置 fontFamily: 'Inter ,"Noto Sans SC",-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important', + + // 文本颜色 (提升可读性, 但不过度突兀) + textColorBase: isDarkMode.value ? '#ECECEC' : '#333333', + textColor1: isDarkMode.value ? '#E6E6E6' : '#333333', + textColor2: isDarkMode.value ? '#CCCCCC' : '#4F4F4F', + textColor3: isDarkMode.value ? '#AAAAAA' : '#656565', }, Tooltip: { color: isDarkMode.value ? '#48484e' : '#FFFFFF', - textColor: isDarkMode.value ? '#FFFFFF' : '#333639', - } + textColor: isDarkMode.value ? '#FFFFFF' : '#333333', + }, }; }) const body = document.body; diff --git a/src/views/BiliAuthView.vue b/src/views/BiliAuthView.vue index 5180670..d429a92 100644 --- a/src/views/BiliAuthView.vue +++ b/src/views/BiliAuthView.vue @@ -31,7 +31,7 @@ type AuthStartModel = { const message = useMessage() const breakpoints = useVueUseBreakpoints(breakpointsTailwind) -const isSmallScreen = breakpoints.smaller('sm') +const isSmallScreen = breakpoints.smaller('md') const guidKey = useStorage('Bili.Auth.Key', uuidv4()) const currentToken = useStorage('Bili.Auth.Selected', null) @@ -122,189 +122,221 @@ onMounted(async () => { + + diff --git a/src/views/IndexView.vue b/src/views/IndexView.vue index 9a2c107..8632e12 100644 --- a/src/views/IndexView.vue +++ b/src/views/IndexView.vue @@ -153,47 +153,95 @@ onMounted(async () => { 一个给主播提供便利功能的网站 😊 + - - - - 我是主播 - - - 开始使用 - - - - - 我是观众 - - - 用户主页 - - - + + + + + 进入主播后台,管理直播相关工具与设置 + + + + + + 进入个人主页,查看积分与互动记录 + + + + + + {