Files
fitness-coach/miniprogram/pages/recommend/recommend.wxss
wm b94eb706ff feat: Kinetic Dark 设计语言 + Lucide 图标迁移 + 首页轻量个性化
- 建立 Lucide 子集 iconfont(49 字形),全站 emoji 替换为 fc-icon 组件
- 重塑 Design Token(冷中性近黑底 + Volt 荧光绿 #B6F24E),消除硬编码颜色
- 首页登录后个性化:我的计划 / 我的收藏 / 今日推荐(纯前端复用现有 API)
- 后端 DEFAULT_EMOJI→Lucide 名,PALETTE 对齐 Kinetic Dark 语义色板
- 修复 person-standing 缺失字形;14 个官方组合 seed emoji 全部映射到现有字形
2026-07-22 21:38:56 +08:00

47 lines
2.3 KiB
Plaintext

.page { min-height: 100vh; background: var(--bg-grad); }
.topbar { height: 88rpx; display: flex; align-items: center; position: relative; padding: 0 24rpx; }
.topbar__back { font-size: 56rpx; color: var(--gold); width: 60rpx; line-height: 1; }
.topbar__title { position: absolute; left: 0; right: 0; text-align: center; font-size: 34rpx; font-weight: 700; color: var(--text); }
.hero2 { padding: 12rpx 40rpx 28rpx; }
.hero2__eyebrow { color: var(--gold); font-size: 22rpx; letter-spacing: 4rpx; }
.hero2__title { font-size: 48rpx; font-weight: 700; margin-top: 12rpx; }
.hero2__sub { font-size: 26rpx; color: var(--text-2); margin-top: 12rpx; }
.group { margin-bottom: 36rpx; }
.group__label { margin-bottom: 18rpx; }
.group__chips { display: flex; flex-wrap: wrap; gap: 16rpx; }
.tgt {
display: inline-flex; align-items: center; gap: 10rpx;
background: var(--surface); border: 1rpx solid var(--line);
border-radius: 999rpx; padding: 16rpx 28rpx; font-size: 26rpx; color: var(--text);
}
.tgt--active { background: var(--gold-soft); border-color: var(--gold-line); color: var(--gold-2); }
.tgt__count { font-size: 22rpx; color: var(--text-3); }
.tgt--active .tgt__count { color: var(--gold); }
.confirm {
position: fixed; left: 0; right: 0; bottom: 0;
padding: 20rpx 32rpx;
background: var(--bar-bg);
backdrop-filter: blur(12px);
border-top: 1rpx solid var(--line);
padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
}
.confirm__bar { text-align: center; margin-bottom: 14rpx; }
.confirm__sel { color: var(--gold-2); font-size: 26rpx; }
.confirm__hint { color: var(--text-3); font-size: 26rpx; }
.cta {
display: flex; align-items: center; justify-content: center;
background: linear-gradient(135deg, var(--gold) 0%, var(--gold-2) 100%);
color: var(--accent-on); font-weight: 700; font-size: 32rpx;
border-radius: 999rpx; padding: 26rpx;
}
.cta__arrow { margin-left: 12rpx; font-size: 36rpx; }
.result-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 20rpx; }
.result-head__title { font-size: 36rpx; font-weight: 700; color: var(--text); }
.result-head__count { font-size: 24rpx; color: var(--gold); }
.rlist { display: flex; flex-direction: column; gap: 20rpx; }
.empty { color: var(--text-3); font-size: 26rpx; text-align: center; padding: 80rpx 0; }