OPC-Hub/training
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(mini): 活动详情页标签芯片样式与列表页统一

Browse Source 
修复详情页图片上标签芯片颜色错误：
- .ed-tag 默认：从 #a8c4ff浅蓝底+黑字 改为 rgba(255,255,255,0.92)白底+深字
- .ed-tag.alt（沙龙）：从蓝底+深字 改为 蓝底+白字
- .ed-tag.mode（线下）：从黑半透明+深字 改为 深半透明+白字
- 新增 .ed-tag.mode.online（线上）：浅蓝底+深字
- .ed-tag.status：白底+深字
- 字号 22rpx→20rpx，padding 6rpx 20rpx→3rpx 14rpx，与列表页一致
- 标签位置 top/left 24rpx/28rpx→20rpx/20rpx，gap 12rpx→8rpx
- jsx mode标签加 online 类，线上活动样式正确
This commit is contained in:
Pine
2026-09-02 00:19:29 +08:00
parent ff9b7eab08
commit 07669c32dc
2 changed files with 8 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
miniprogram/src/pages-extra/event-detail/index.jsx
+1 -1
View File
@@ -234,7 +234,7 @@ export default function EventDetail() {
onError={(e) => { try { e.currentTarget.src = coverWide; } catch { /* ignore */ } }} />
<View className="ed-hero-tags">
<Text className={`ed-tag${ev.type === 'salon' ? ' alt' : ''}`}>{ev.type === 'salon' ? '沙龙' : '公益课'}</Text>
<Text className="ed-tag mode">{ev.mode === 'online' ? '线上' : '线下'}</Text>
<Text className={`ed-tag mode${ev.mode === 'online' ? ' online' : ''}`}>{ev.mode === 'online' ? '线上' : '线下'}</Text>
<Text className="ed-tag status" style={{ color: (STATUS_META[ev.status] || {}).color }}>
{(STATUS_META[ev.status] || { text: ev.status }).text}
</Text>
miniprogram/src/pages-extra/event-detail/index.scss
+7 -6
View File
@@ -17,14 +17,15 @@
border-radius: 999px; padding: 6rpx 22rpx;
}
.ed-img-title { font-size: 44rpx; font-weight: 800; color: #23315c; line-height: 1.3; }
.ed-hero-tags { position: absolute; top: 24rpx; left: 28rpx; display: flex; gap: 12rpx; }
.ed-hero-tags { position: absolute; top: 20rpx; left: 20rpx; display: flex; gap: 8rpx; }
.ed-tag {
font-size: 22rpx; font-weight: 700; color: #000; background: #a8c4ff;
border-radius: 999px; padding: 6rpx 20rpx;
font-size: 20rpx; font-weight: 700; color: #23315c; background: rgba(255,255,255,0.92);
border-radius: 999px; padding: 3rpx 14rpx;
}
.ed-tag.alt { background: #5b8cff; color: #23315c; }
.ed-tag.mode { background: rgba(0, 0, 0, 0.45); color: #23315c; }
.ed-tag.status { background: rgba(255, 255, 255, 0.9); color: #000; }
.ed-tag.alt { background: #5b8cff; color: #fff; }
.ed-tag.mode { background: rgba(20,28,54,0.78); color: #fff; }
.ed-tag.mode.online { background: rgba(140,200,255,0.92); color: #0a1a3a; }
.ed-tag.status { background: rgba(255,255,255,0.92); color: #23315c; }
/* 正文 */
.ed-body { padding: 30rpx 32rpx 8rpx; }