style(home): 首页轮播高度压缩三分之一

轮播高度 380rpx → 254rpx,标题/副标题/按钮/平台实力数据卡/关闭按钮/指示点同步紧凑,保持后端 theme、action_text、stats 数据字段不变
这个提交包含在:
linda
2026-10-29 09:25:17 +08:00
父节点 681b83a762
当前提交 508d2c7318

查看文件

@@ -1050,7 +1050,7 @@
/* ---------- 品牌 / 服务主题轮播 ---------- */ /* ---------- 品牌 / 服务主题轮播 ---------- */
.banner-wrap { margin-top: 24rpx; } .banner-wrap { margin-top: 24rpx; }
.banner-swiper { .banner-swiper {
height: 380rpx; height: 254rpx;
border-radius: 24rpx; border-radius: 24rpx;
overflow: hidden; overflow: hidden;
box-shadow: 0 12rpx 28rpx rgba(236, 110, 12, 0.20); box-shadow: 0 12rpx 28rpx rgba(236, 110, 12, 0.20);
@@ -1060,7 +1060,7 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
box-sizing: border-box; box-sizing: border-box;
padding: 30rpx 30rpx 26rpx; padding: 22rpx 26rpx 18rpx;
overflow: hidden; overflow: hidden;
border-radius: 24rpx; border-radius: 24rpx;
} }
@@ -1083,31 +1083,32 @@
} }
.slide-tags { position: relative; z-index: 2; display: flex; } .slide-tags { position: relative; z-index: 2; display: flex; }
.slide-tag { .slide-tag {
padding: 0 14rpx; line-height: 34rpx; border-radius: 17rpx; padding: 0 12rpx; line-height: 30rpx; border-radius: 15rpx;
font-size: 20rpx; letter-spacing: 1rpx; font-size: 18rpx; letter-spacing: 1rpx;
} }
.theme-promo .slide-tag { background: linear-gradient(135deg, #F5452B 0%, #D92210 100%); color: #FFE9A8; } .theme-promo .slide-tag { background: linear-gradient(135deg, #F5452B 0%, #D92210 100%); color: #FFE9A8; }
.theme-promo .slide-tag.ghost { margin-left: 10rpx; background: rgba(232,51,27,.12); color: #C0392B; } .theme-promo .slide-tag.ghost { margin-left: 10rpx; background: rgba(232,51,27,.12); color: #C0392B; }
.theme-service .slide-tag { background: rgba(255,255,255,.22); color: #fff; } .theme-service .slide-tag { background: rgba(255,255,255,.22); color: #fff; }
.slide-title { .slide-title {
position: relative; z-index: 2; display: block; margin-top: 14rpx; position: relative; z-index: 2; display: block; margin-top: 10rpx;
font-size: 46rpx; font-weight: 800; letter-spacing: 1rpx; line-height: 1.18; font-size: 36rpx; font-weight: 800; letter-spacing: 1rpx; line-height: 1.16;
overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
} }
.theme-promo .slide-title { color: #E8331B; text-shadow: 0 3rpx 0 #FFE9A8; } .theme-promo .slide-title { color: #E8331B; text-shadow: 0 3rpx 0 #FFE9A8; }
.theme-service .slide-title { color: #fff; } .theme-service .slide-title { color: #fff; }
.slide-sub { position: relative; z-index: 2; display: block; margin-top: 8rpx; font-size: 24rpx; line-height: 1.4; } .slide-sub { position: relative; z-index: 2; display: block; margin-top: 6rpx; font-size: 21rpx; line-height: 1.35; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.theme-promo .slide-sub { color: #C0392B; } .theme-promo .slide-sub { color: #C0392B; }
.theme-service .slide-sub { color: rgba(255,255,255,.92); } .theme-service .slide-sub { color: rgba(255,255,255,.92); }
.slide-bottom { .slide-bottom {
position: absolute; left: 30rpx; right: 30rpx; bottom: 26rpx; z-index: 3; position: absolute; left: 26rpx; right: 26rpx; bottom: 18rpx; z-index: 3;
display: flex; align-items: center; justify-content: space-between; display: flex; align-items: center; justify-content: space-between;
} }
.slide-date { padding: 0 16rpx; line-height: 34rpx; border-radius: 17rpx; font-size: 21rpx; } .slide-date { padding: 0 14rpx; line-height: 30rpx; border-radius: 15rpx; font-size: 19rpx; }
.theme-promo .slide-date { background: rgba(232,51,27,.10); color: #C0392B; } .theme-promo .slide-date { background: rgba(232,51,27,.10); color: #C0392B; }
.theme-service .slide-date { background: rgba(255,255,255,.18); color: #fff; } .theme-service .slide-date { background: rgba(255,255,255,.18); color: #fff; }
.slide-cta { .slide-cta {
height: 60rpx; padding: 0 26rpx; display: flex; align-items: center; height: 52rpx; padding: 0 22rpx; display: flex; align-items: center;
border-radius: 30rpx; font-size: 24rpx; font-weight: 600; border-radius: 26rpx; font-size: 21rpx; font-weight: 600;
} }
.theme-promo .slide-cta { .theme-promo .slide-cta {
background: linear-gradient(135deg, #FF9E2E 0%, #EE6C05 100%); color: #fff; background: linear-gradient(135deg, #FF9E2E 0%, #EE6C05 100%); color: #fff;
@@ -1118,29 +1119,29 @@
box-shadow: 0 6rpx 16rpx rgba(0,0,0,.12); box-shadow: 0 6rpx 16rpx rgba(0,0,0,.12);
} }
.slide-close { .slide-close {
position: absolute; right: 20rpx; top: 20rpx; z-index: 4; position: absolute; right: 14rpx; top: 14rpx; z-index: 4;
width: 40rpx; height: 40rpx; line-height: 36rpx; text-align: center; width: 34rpx; height: 34rpx; line-height: 30rpx; text-align: center;
border-radius: 50%; font-size: 28rpx; border-radius: 50%; font-size: 24rpx;
} }
.theme-promo .slide-close { background: rgba(0,0,0,.10); color: #B85E2A; } .theme-promo .slide-close { background: rgba(0,0,0,.10); color: #B85E2A; }
.slide-watermark { .slide-watermark {
position: absolute; right: 26rpx; bottom: -18rpx; z-index: 1; position: absolute; right: 18rpx; bottom: -12rpx; z-index: 1;
font-size: 220rpx; line-height: 1; font-weight: 800; color: rgba(255,255,255,.09); font-size: 160rpx; line-height: 1; font-weight: 800; color: rgba(255,255,255,.09);
} }
.brand-head { position: relative; z-index: 2; display: flex; align-items: center; } .brand-head { position: relative; z-index: 2; display: flex; align-items: center; }
.brand-line { width: 6rpx; height: 28rpx; border-radius: 3rpx; background: #FFF0C9; margin-right: 10rpx; } .brand-line { width: 5rpx; height: 22rpx; border-radius: 3rpx; background: #FFF0C9; margin-right: 8rpx; }
.brand-title { font-size: 28rpx; font-weight: 600; color: #FFF3DF; letter-spacing: 1rpx; } .brand-title { font-size: 24rpx; font-weight: 600; color: #FFF3DF; letter-spacing: 1rpx; }
.brand-grid { position: relative; z-index: 2; display: flex; align-items: flex-end; margin-top: 24rpx; } .brand-grid { position: relative; z-index: 2; display: flex; align-items: flex-end; margin-top: 14rpx; }
.brand-cell { flex: 1; display: flex; flex-direction: column; align-items: center; border-left: 2rpx solid rgba(255,255,255,.28); } .brand-cell { flex: 1; display: flex; flex-direction: column; align-items: center; border-left: 2rpx solid rgba(255,255,255,.28); }
.brand-cell:first-child { border-left: none; } .brand-cell:first-child { border-left: none; }
.brand-value { font-size: 48rpx; line-height: 58rpx; font-weight: 800; color: #fff; letter-spacing: 1rpx; } .brand-value { font-size: 36rpx; line-height: 42rpx; font-weight: 800; color: #fff; letter-spacing: 1rpx; }
.brand-label { margin-top: 6rpx; font-size: 22rpx; color: rgba(255,255,255,.85); } .brand-label { margin-top: 3rpx; font-size: 19rpx; color: rgba(255,255,255,.85); }
.brand-foot { .brand-foot {
position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between;
margin-top: 24rpx; padding-top: 18rpx; border-top: 2rpx solid rgba(255,255,255,.22); margin-top: 14rpx; padding-top: 12rpx; border-top: 2rpx solid rgba(255,255,255,.22);
} }
.brand-foot-txt { font-size: 22rpx; color: rgba(255,255,255,.90); } .brand-foot-txt { font-size: 19rpx; color: rgba(255,255,255,.90); }
.brand-seal { padding: 6rpx 14rpx; border-radius: 8rpx; background: #FFF4E3; color: #E8331B; font-size: 20rpx; font-weight: 700; } .brand-seal { padding: 4rpx 12rpx; border-radius: 7rpx; background: #FFF4E3; color: #E8331B; font-size: 18rpx; font-weight: 700; }
.banner-slide.has-image .slide-title, .banner-slide.has-image .slide-title,
.banner-slide.has-image .slide-sub, .banner-slide.has-image .slide-sub,
.banner-slide.has-image .brand-title, .banner-slide.has-image .brand-title,
@@ -1149,9 +1150,9 @@
.banner-slide.has-image .brand-foot-txt, .banner-slide.has-image .brand-foot-txt,
.banner-slide.has-image .slide-tag, .banner-slide.has-image .slide-tag,
.banner-slide.has-image .slide-date { color: #fff; } .banner-slide.has-image .slide-date { color: #fff; }
.banner-dots { display: flex; align-items: center; justify-content: center; margin-top: 14rpx; } .banner-dots { display: flex; align-items: center; justify-content: center; margin-top: 10rpx; }
.banner-dot { width: 12rpx; height: 6rpx; border-radius: 3rpx; background: #FFD4B5; margin: 0 5rpx; transition: all .25s; } .banner-dot { width: 10rpx; height: 5rpx; border-radius: 2.5rpx; background: #FFD4B5; margin: 0 4rpx; transition: all .25s; }
.banner-dot.on { width: 30rpx; background: #F0710D; } .banner-dot.on { width: 24rpx; background: #F0710D; }
.foot-tip { .foot-tip {
padding: 36rpx 0 10rpx; padding: 36rpx 0 10rpx;