feat: 完成首页修改
This commit is contained in:
@@ -45,29 +45,44 @@
|
||||
}
|
||||
|
||||
.home-tabs-wrap {
|
||||
margin-top: @section-gap;
|
||||
margin-top: 48rpx;
|
||||
}
|
||||
|
||||
.home-hero-placeholder {
|
||||
margin: @section-gap @page-padding-x 0;
|
||||
height: 480rpx;
|
||||
height: 450rpx;
|
||||
border-radius: 40rpx;
|
||||
background: rgba(50, 46, 37, 0.04);
|
||||
}
|
||||
|
||||
/** 首页顶部「精选」横滑行(与下方模块 track 列表的 .home-track-row 区分) */
|
||||
.home-hero-row {
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
gap: @section-gap-sm;
|
||||
padding: 24rpx @page-padding-x;
|
||||
/** 首页顶部「精选」swiper 轮播 */
|
||||
.home-hero-swiper {
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
height: 450rpx;
|
||||
}
|
||||
|
||||
.home-hero-swiper-item {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.home-hero-card-wrap {
|
||||
padding: 24rpx;
|
||||
box-sizing: border-box;
|
||||
transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94),
|
||||
opacity 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
||||
transform: scale(0.9);
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.home-hero-card-wrap--active {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.home-hero-card {
|
||||
width: 560rpx;
|
||||
flex-shrink: 0;
|
||||
width: 100%;
|
||||
border-radius: 32rpx;
|
||||
/* 让阴影不被自身 overflow: hidden 裁切 */
|
||||
overflow: visible;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 10rpx 28rpx rgba(50, 46, 37, 0.08);
|
||||
@@ -118,7 +133,7 @@
|
||||
.home-hero-card__title-row {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: baseline;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16rpx;
|
||||
/* 允许 flex 子项在文本过长时正确截断 */
|
||||
|
||||
Reference in New Issue
Block a user