样式修改
This commit is contained in:
@@ -187,7 +187,6 @@
|
||||
justify-content: center;
|
||||
font-size: 34px;
|
||||
border-radius: 16px;
|
||||
background: rgba(255, 255, 255, 0.25);
|
||||
margin-bottom: 14px;
|
||||
overflow: hidden;
|
||||
|
||||
@@ -286,38 +285,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 活动专区 section-card 图标底色(循环使用)
|
||||
.card-ic-0 .card-icon {
|
||||
background: #fff0ed;
|
||||
}
|
||||
.card-ic-1 .card-icon {
|
||||
background: #fff7e6;
|
||||
}
|
||||
.card-ic-2 .card-icon {
|
||||
background: #e6f7ff;
|
||||
}
|
||||
.card-ic-3 .card-icon {
|
||||
background: #f0edff;
|
||||
}
|
||||
|
||||
.bottom-section {
|
||||
padding: 0 32px;
|
||||
|
||||
// 每张卡片图标不同底色
|
||||
.card-hot .card-icon {
|
||||
background: #fff0ed;
|
||||
}
|
||||
.card-discount .card-icon {
|
||||
background: #fff7e6;
|
||||
}
|
||||
.card-new .card-icon {
|
||||
background: #e6f7ff;
|
||||
}
|
||||
.card-order .card-icon {
|
||||
background: #f0edff;
|
||||
}
|
||||
}
|
||||
|
||||
// 底部留白
|
||||
.bottom-spacer {
|
||||
height: 60px;
|
||||
|
||||
@@ -160,7 +160,7 @@ export default function Index() {
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{activity.length > 0 ? (
|
||||
{activity.length > 0 && (
|
||||
<>
|
||||
{/* 前两个:activity-card 渐变卡片 */}
|
||||
<View className={`activity-cards ${activity.length === 1 ? 'single' : ''}`}>
|
||||
@@ -187,7 +187,7 @@ export default function Index() {
|
||||
{activity.slice(2).map((item, index) => (
|
||||
<View
|
||||
key={item.id}
|
||||
className={`section-card card-ic-${index % 4}`}
|
||||
className='section-card'
|
||||
onClick={() => handleNavigate(item)}
|
||||
>
|
||||
<View className='card-icon'>
|
||||
@@ -201,83 +201,9 @@ export default function Index() {
|
||||
</View>
|
||||
))}
|
||||
</>
|
||||
) : (
|
||||
/* 兜底静态内容 */
|
||||
<View className='activity-cards'>
|
||||
{/* 满减优惠 */}
|
||||
<View
|
||||
className='activity-card card-fullcut'
|
||||
onClick={() => {
|
||||
// TODO: 活动页面上线后配置跳转链接
|
||||
}}
|
||||
>
|
||||
<View className='deco-circle circle-1' />
|
||||
<View className='deco-circle circle-2' />
|
||||
<View className='activity-card-main'>
|
||||
<View className='activity-icon'>🎫</View>
|
||||
<View className='activity-name'>满减优惠</View>
|
||||
<View className='activity-desc'>满30减5 · 可与券叠加</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* 新品首发 */}
|
||||
<View
|
||||
className='activity-card card-newbie'
|
||||
onClick={() => {
|
||||
// TODO: 活动页面上线后配置跳转链接
|
||||
}}
|
||||
>
|
||||
<View className='deco-circle circle-1' />
|
||||
<View className='deco-circle circle-2' />
|
||||
<View className='activity-card-main'>
|
||||
<View className='activity-icon'>✨</View>
|
||||
<View className='activity-name'>新品首发</View>
|
||||
<View className='activity-desc'>每周三上新 · 限时尝鲜价</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)}
|
||||
</View>
|
||||
|
||||
{/* 5. 底部推荐卡片 */}
|
||||
<View className='bottom-section'>
|
||||
<View className='section-card card-hot'>
|
||||
<View className='card-icon'>🔥</View>
|
||||
<View className='card-info'>
|
||||
<View className='card-title'>热门推荐</View>
|
||||
<View className='card-desc'>查看同学们都在点什么</View>
|
||||
</View>
|
||||
<View className='card-arrow'>›</View>
|
||||
</View>
|
||||
|
||||
<View className='section-card card-discount'>
|
||||
<View className='card-icon'>💰</View>
|
||||
<View className='card-info'>
|
||||
<View className='card-title'>限时优惠</View>
|
||||
<View className='card-desc'>超值套餐低至9.9元</View>
|
||||
</View>
|
||||
<View className='card-arrow'>›</View>
|
||||
</View>
|
||||
|
||||
<View className='section-card card-new'>
|
||||
<View className='card-icon'>⭐</View>
|
||||
<View className='card-info'>
|
||||
<View className='card-title'>新品上架</View>
|
||||
<View className='card-desc'>尝尝校园新味道</View>
|
||||
</View>
|
||||
<View className='card-arrow'>›</View>
|
||||
</View>
|
||||
|
||||
<View className='section-card card-order'>
|
||||
<View className='card-icon'>📋</View>
|
||||
<View className='card-info'>
|
||||
<View className='card-title'>我的订单</View>
|
||||
<View className='card-desc'>查看订单状态与历史</View>
|
||||
</View>
|
||||
<View className='card-arrow'>›</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
{/* 底部留白 */}
|
||||
<View className='bottom-spacer' />
|
||||
</View>
|
||||
|
||||
Reference in New Issue
Block a user