小程序端:设计系统收敛与排版层级修复

问题:88 个 wxss 里散落大量硬编码颜色/字号/字重,无法统一调整;
部分正文对比度不达 WCAG AA(4.5:1);组件触摸目标偏小。

改动:
- 硬编码颜色收敛到语义 token(颜色统一走 design token,不再散落字面值)
- 修正全站字号阶梯:正文 ≥12px、角标 ≥11px;字重只用 400/500/600/700
- 组件触摸目标提升到 ≥44px,并补交互反馈
- 首页补氛围层次、强化排版层级

验证(本轮实测):
- UI 契约门禁 18/18 PASS(含 wxml 结构、wxss 组件选择器、token 显式值断言)
- 声明级体检 88/88 通过(全部 wxss 声明合法)

交付物:artifacts/miniapp-design-v2-preview.html
This commit is contained in:
WorkBuddy
2026-09-23 01:06:46 +08:00
parent 825fd41ee4
commit 269adf1fed
81 changed files with 5064 additions and 3533 deletions
@@ -1,19 +1,19 @@
.container { padding: 24rpx; min-height: 100vh; background: #f5f5f5; }
.loading { text-align: center; padding: 80rpx; color: #999; }
.empty { text-align: center; padding: 80rpx 0; }
.empty-icon { font-size: 80rpx; display: block; margin-bottom: 20rpx; }
.empty-text { font-size: 32rpx; color: #666; display: block; }
.empty-hint { font-size: 26rpx; color: #999; display: block; margin-top: 12rpx; }
.result-card { background: #fff; border-radius: 16rpx; padding: 24rpx; margin-bottom: 20rpx; box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05); }
.card-header { display: flex; align-items: center; margin-bottom: 16rpx; }
.avatar { width: 80rpx; height: 80rpx; border-radius: 50rpx; background: #eee; }
.info { flex: 1; margin-left: 20rpx; }
.name { font-size: 30rpx; font-weight: bold; color: #333; display: block; }
.status-badge { font-size: 22rpx; padding: 4rpx 12rpx; border-radius: 12rpx; margin-top: 8rpx; display: inline-block; }
.badge-confirmed { background: #e8f5e9; color: #2e7d32; }
.badge-waiting { background: #fff3e0; color: #e65100; }
.card-body { margin-bottom: 16rpx; }
.activity-name { font-size: 24rpx; color: #999; }
.card-actions { display: flex; justify-content: flex-end; }
.btn-waiting { background: #f5f5f5; color: #999; font-size: 26rpx; padding: 12rpx 32rpx; border-radius: 24rpx; border: none; }
.btn-chat { background: linear-gradient(135deg, #FF6B6B, #EE5A24); color: #fff; font-size: 26rpx; padding: 12rpx 32rpx; border-radius: 24rpx; border: none; }
.container { padding:24rpx; min-height:100vh; background:var(--color-bg-subtle); }
.loading { text-align:center; padding:80rpx; color:var(--color-text-tertiary); }
.empty { text-align:center; padding:80rpx 0; }
.empty-icon { font-size:80rpx; display:block; margin-bottom:20rpx; }
.empty-text { font-size:32rpx; color:var(--color-text-secondary); display:block; }
.empty-hint { font-size:26rpx; color:var(--color-text-tertiary); display:block; margin-top:12rpx; }
.result-card { background:var(--color-bg-card); border-radius:16rpx; padding:24rpx; margin-bottom:20rpx; box-shadow:0 2rpx 8rpx rgba(0,0,0,0.05); }
.card-header { display:flex; align-items:center; margin-bottom:16rpx; }
.avatar { width:80rpx; height:80rpx; border-radius:50rpx; background:var(--color-bg-subtle); }
.info { flex:1; margin-left:20rpx; }
.name { font-size:30rpx; font-weight:bold; color:var(--color-text-primary); display:block; }
.status-badge { font-size:22rpx; padding:4rpx 12rpx; border-radius:12rpx; margin-top:8rpx; display:inline-block; }
.badge-confirmed { background:var(--color-success-light); color:var(--color-success-strong); }
.badge-waiting { background:var(--color-warning-light); color:var(--color-warning-strong); }
.card-body { margin-bottom:16rpx; }
.activity-name { font-size:24rpx; color:var(--color-text-tertiary); }
.card-actions { display:flex; justify-content:flex-end; }
.btn-waiting { background:var(--color-bg-subtle); color:var(--color-text-tertiary); font-size:26rpx; padding:12rpx 32rpx; border-radius:24rpx; border:none; }
.btn-chat { background:var(--gradient-brand-solid); color:var(--color-text-inverse); font-size:26rpx; padding:12rpx 32rpx; border-radius:24rpx; border:none; }