wikiboss/shanghaipeiwan
1
0
派生 0
代码 工单 合并请求 Actions 软件包 项目 版本发布 百科 动态

feat(ui): 基于10大子代理全面优化浅色暖色系视觉断层与多端无障碍体验

浏览代码
这个提交包含在：
wikiboss
2026-09-16 20:35:29 +08:00
父节点 1a56ba2682
当前提交 db38e380bf
共有 6 个文件被更改，包括 117 次插入 和 17 次删除
下载 Patch 文件 下载 Diff 文件 展开所有文件 折叠所有文件

37
pwuniapp/App.vue
查看文件

@@ -118,24 +118,33 @@ html, body {
@media screen and (min-width: 481px) {
html, body {
background-color: #050811 !important;
transition: background-color 0.3s ease;
}
body:has(.theme-warm) {
background-color: #EDE8E0 !important;
}
uni-app {
max-width: 450px !important;
margin: 20px auto !important;
min-height: calc(100vh - 40px) !important;
box-shadow: 0 0 80rpx rgba(0, 0, 0, 0.95), 0 0 0 2rpx var(--color-brand-glow, rgba(99, 102, 241, 0.25)) !important;
box-shadow: 0 0 60rpx rgba(0, 0, 0, 0.4), 0 0 0 2rpx var(--color-brand-glow, rgba(99, 102, 241, 0.25)) !important;
border-radius: 40rpx !important;
overflow: hidden !important;
position: relative !important;
background-color: var(--bg-primary, #0A0F1D) !important;
}
uni-page-head {
uni-page-head, .uni-page-head {
max-width: 450px !important;
left: 0 !important;
right: 0 !important;
margin: 0 auto !important;
top: 20px !important;
border-top-left-radius: 40rpx !important;
border-top-right-radius: 40rpx !important;
overflow: hidden !important;
}
uni-tabbar, .uni-tabbar {
@@ -192,33 +201,47 @@ uni-page-head .uni-page-head__title {
/* 浅色暖阳晨曦模式下强制确保 TabBar 与 PageHead 呈现高质感浅色 */
body:has(.theme-warm) uni-page-head,
page.theme-warm ~ uni-page-head {
body:has(.theme-warm) .uni-page-head,
page.theme-warm ~ uni-page-head,
.theme-warm uni-page-head {
background-color: #FDFBF7 !important;
border-bottom: 1px solid #F0ECE4 !important;
}
body:has(.theme-warm) uni-page-head .uni-page-head__title,
page.theme-warm ~ uni-page-head .uni-page-head__title {
body:has(.theme-warm) .uni-page-head .uni-page-head__title,
page.theme-warm ~ uni-page-head .uni-page-head__title,
.theme-warm uni-page-head .uni-page-head__title,
body:has(.theme-warm) uni-page-head *,
.theme-warm uni-page-head * {
color: #1C1917 !important;
}
body:has(.theme-warm) uni-tabbar .uni-tabbar__bd,
page.theme-warm ~ uni-tabbar .uni-tabbar__bd {
page.theme-warm ~ uni-tabbar .uni-tabbar__bd,
.theme-warm ~ uni-tabbar .uni-tabbar__bd {
background-color: #FFFFFF !important;
border-top: 1px solid #F0ECE4 !important;
box-shadow: 0 -4rpx 20rpx rgba(28, 25, 23, 0.04) !important;
}
body:has(.theme-warm) uni-tabbar .uni-tabbar__label,
page.theme-warm ~ uni-tabbar .uni-tabbar__label {
page.theme-warm ~ uni-tabbar .uni-tabbar__label,
body:has(.theme-warm) uni-tabbar span {
color: #78716C !important;
font-size: 13px !important;
font-weight: 500 !important;
}
body:has(.theme-warm) uni-tabbar .uni-tabbar-item.active .uni-tabbar__label,
page.theme-warm ~ uni-tabbar .uni-tabbar-item.active .uni-tabbar__label,
body:has(.theme-warm) uni-tabbar .uni-tabbar__item.active .uni-tabbar__label,
page.theme-warm ~ uni-tabbar .uni-tabbar__item.active .uni-tabbar__label {
page.theme-warm ~ uni-tabbar .uni-tabbar__item.active .uni-tabbar__label,
body:has(.theme-warm) uni-tabbar .active .uni-tabbar__label,
body:has(.theme-warm) uni-tabbar [class*="active"] .uni-tabbar__label,
body:has(.theme-warm) uni-tabbar [class*="active"] span {
color: #EA580C !important;
font-weight: 700 !important;
}
/* #endif */
</style>

2
pwuniapp/common/theme.js
查看文件

@@ -127,7 +127,7 @@ export function getCurrentThemeKey() {
} catch (e) {
// 忽略异常，降级到默认
}
return THEME_KEYS.COOL;
return THEME_KEYS.WARM;
}
/**

7
pwuniapp/pages/activity/list.vue
查看文件

@@ -568,6 +568,13 @@ const createActivity = () => {
}
}
@media screen and (min-width: 481px) {
.fab-btn {
right: calc(50% - 225px + 36rpx);
bottom: calc(140rpx + 20px);
}
}
@keyframes fabPulse {
0%, 100% { box-shadow: 0 8rpx 24rpx rgba(99, 102, 241, 0.45); }
50% { box-shadow: 0 8rpx 36rpx rgba(99, 102, 241, 0.75); }

34
pwuniapp/pages/index/index.vue
查看文件

@@ -39,7 +39,7 @@
</swiper>
<!-- 快捷功能金刚区 (纯矢量SVG图标，88rpx触控热区) -->
<view class="quick-grid">
<view class="quick-grid grid-card">
<view class="quick-item btn-active" @click="navTo('/pages/activity/list')">
<view class="quick-icon-bg bg-purple">
<image class="quick-svg" :src="ICONS.teamUp" mode="aspectFit" />
@@ -761,6 +761,21 @@ const navTo = (url) => {
}
}
.quick-grid, .grid-card {
background-color: #FFFFFF;
border-color: #F0ECE4;
box-shadow: 0 4rpx 20rpx rgba(28, 25, 23, 0.04);
.quick-item {
.quick-title {
color: #1C1917;
}
.quick-sub {
color: #78716C;
}
}
}
.section-title-wrap .section-title text {
color: #1C1917;
}
@@ -770,8 +785,21 @@ const navTo = (url) => {
border: 1px solid #F0ECE4;
box-shadow: 0 6rpx 24rpx rgba(28, 25, 23, 0.05);
.expert-info .nickname {
color: #1C1917;
.expert-info {
.nickname {
color: #1C1917;
}
.bio, .order-count {
color: #78716C;
}
}
.voice-bar {
background: rgba(234, 88, 12, 0.08);
border: 1px solid rgba(234, 88, 12, 0.2);
.voice-title {
color: #EA580C;
}
}
}
}

19
pwuniapp/pages/user/index.vue
查看文件

@@ -16,7 +16,7 @@
</view>
<!-- 核心亮点：双身份流光切换卡 (纯矢量与流光动效) -->
<view class="role-switch-card card-active" @click="toggleRole">
<view class="role-switch-card identity-banner card-active" @click="toggleRole">
<view class="role-glow-border"></view>
<view class="role-content">
<view class="role-left">
@@ -608,10 +608,19 @@ const navTo = (url) => {
}
}
.role-switch-card {
.role-switch-card, .identity-banner {
background-color: #FFFFFF;
border: 1px solid #F0ECE4;
box-shadow: 0 4rpx 20rpx rgba(28, 25, 23, 0.05);
box-shadow: 0 4rpx 20rpx rgba(234, 88, 12, 0.12);
&::after {
background: linear-gradient(135deg, #FFFFFF 0%, #FDFBF7 100%);
border-radius: 22rpx;
}
&::before {
background: conic-gradient(from 0deg, transparent 0%, #EA580C 25%, #F59E0B 50%, #EA580C 75%, transparent 100%);
}
.role-content .role-left {
.current-role-tag {
@@ -622,11 +631,9 @@ const navTo = (url) => {
}
}
.role-glow-border {
background: conic-gradient(from 0deg, #F97316, #F59E0B, #EA580C, #F97316);
}
.btn-switch-role {
background: linear-gradient(135deg, #F97316, #EA580C);
color: #FFFFFF;
box-shadow: 0 4rpx 16rpx rgba(234, 88, 12, 0.35);
}
}

35
server/tests/theme.spec.ts
查看文件

@@ -231,5 +231,40 @@ describe('ThemeManager (TDD 测试套件: 暖色系与双主题设计系统)', (
}
});
});
describe('7. 浅色暖色系深度视觉与无障碍体验门禁校验', () => {
const rootDir = path.resolve(__dirname, '../../');
const indexVuePath = path.join(rootDir, 'pwuniapp', 'pages', 'index', 'index.vue');
const userVuePath = path.join(rootDir, 'pwuniapp', 'pages', 'user', 'index.vue');
const activityVuePath = path.join(rootDir, 'pwuniapp', 'pages', 'activity', 'list.vue');
const appVuePath = path.join(rootDir, 'pwuniapp', 'App.vue');
it('首页在 theme-warm 下必须对金刚区卡片与大神卡片进行浅色纯白重构', () => {
const content = fs.readFileSync(indexVuePath, 'utf-8');
expect(content).toContain('.theme-warm');
// 必须包含针对 grid-card 与 expert-card 的纯白背景或深文本适配
expect(content.includes('grid-card') && content.includes('#FFFFFF')).toBe(true);
expect(content.includes('expert-card') && content.includes('#1C1917')).toBe(true);
});
it('个人中心身份横幅在 theme-warm 下必须进行浅暖微光重构', () => {
const content = fs.readFileSync(userVuePath, 'utf-8');
expect(content.includes('identity-banner') && content.includes('#1C1917')).toBe(true);
});
it('活动列表页悬浮按钮必须包含大屏机壳边界约束', () => {
const content = fs.readFileSync(activityVuePath, 'utf-8');
// 必须针对大屏仿真外壳有边界控制（如 max-width 450px 居中计算或媒体查询）
expect(content.includes('min-width: 481px') || content.includes('calc(50%')).toBe(true);
});
it('App.vue 必须包含针对 uni-page-head 强制米白底和深黑标题字的强穿透规则', () => {
const content = fs.readFileSync(appVuePath, 'utf-8');
expect(content).toContain('uni-page-head');
expect(content).toContain('#FDFBF7');
expect(content).toContain('#1C1917');
});
});
});