feat(leaderboard): 新增耐力榜(全局单次最久 top10) + 领奖台日期两行 + 顶部哲理文案
- 云函数支持 endurance 周期:遍历全部 records 取 max(duration) 及 bestDate - 客户端新增耐力榜 tab(maxRank=10),未上榜时在底部 my-bar 显示最佳成绩+产生时间 - 领奖台底座(耐力榜)单次日期拆成「日期+时间」两行,统一三阶底座高度修复第3名贴顶 - 领奖台顶部新增哲理文案,配置进 config.js(leaderboardPodiumSlogan),斜体金句卡片样式
This commit is contained in:
@@ -69,6 +69,23 @@
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
/* 耐力榜领奖台顶部文案:哲理注脚,主色呼应 + 金句卡片质感 */
|
||||
.podium-slogan {
|
||||
position: relative;
|
||||
margin: 8rpx 32rpx 4rpx;
|
||||
padding: 22rpx 28rpx 24rpx;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
line-height: 1.65;
|
||||
color: var(--text);
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
background: linear-gradient(135deg, rgba(var(--primary-rgb), 0.10), rgba(var(--primary-rgb), 0.03));
|
||||
border: 1rpx solid rgba(var(--primary-rgb), 0.16);
|
||||
border-radius: 18rpx;
|
||||
box-shadow: 0 4rpx 14rpx rgba(var(--primary-rgb), 0.10);
|
||||
}
|
||||
|
||||
/* ---- podium (top 3) ---- */
|
||||
.podium {
|
||||
display: flex;
|
||||
@@ -194,14 +211,32 @@
|
||||
stepped base heights (the podium itself is bottom-aligned via flex-end). */
|
||||
.podium-base__label {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 10rpx;
|
||||
left: 4rpx;
|
||||
right: 4rpx;
|
||||
bottom: 6rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
font-weight: 700;
|
||||
color: var(--text);
|
||||
line-height: 1;
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
/* 耐力榜副标签(单次日期)在领奖台底座上拆成「日期 + 时间」两行。
|
||||
缩小字号 + 抬高最矮的第 3 名底座(48→64rpx),三阶统一为 96/80/64,
|
||||
让两行文字在各级底座内都垂直居中、不贴顶(含微信字体缩放余量)。 */
|
||||
.podium-base__date {
|
||||
font-size: 18rpx;
|
||||
line-height: 1.15;
|
||||
}
|
||||
.podium-base__time {
|
||||
font-size: 16rpx;
|
||||
line-height: 1.1;
|
||||
opacity: 0.85;
|
||||
margin-top: 2rpx;
|
||||
}
|
||||
|
||||
.podium-dur {
|
||||
@@ -232,12 +267,12 @@
|
||||
box-shadow: 0 6rpx 18rpx rgba(250, 140, 22, 0.30), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.45);
|
||||
}
|
||||
.podium-base--second {
|
||||
height: 64rpx;
|
||||
height: 80rpx;
|
||||
background: linear-gradient(180deg, rgba(201, 205, 212, 0.50), rgba(140, 140, 140, 0.16));
|
||||
box-shadow: 0 6rpx 18rpx rgba(140, 140, 140, 0.22), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.45);
|
||||
}
|
||||
.podium-base--third {
|
||||
height: 48rpx;
|
||||
height: 64rpx;
|
||||
background: linear-gradient(180deg, rgba(232, 160, 106, 0.50), rgba(212, 107, 8, 0.16));
|
||||
box-shadow: 0 6rpx 18rpx rgba(212, 107, 8, 0.22), inset 0 2rpx 4rpx rgba(255, 255, 255, 0.45);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user