From 0555dd7dc2edc553030b7a6d03d6a1cda4b1e336 Mon Sep 17 00:00:00 2001 From: litian <C21AF165> Date: 星期三, 20 三月 2024 15:41:58 +0800 Subject: [PATCH] 111 --- pages/home/home.wxss | 164 ++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 150 insertions(+), 14 deletions(-) diff --git a/pages/home/home.wxss b/pages/home/home.wxss index bdacc2e..67cd4ed 100644 --- a/pages/home/home.wxss +++ b/pages/home/home.wxss @@ -3,6 +3,78 @@ padding-bottom: calc(env(safe-area-inset-bottom) + 96rpx); } +.container { + width: 100vw; + position: relative; + max-height: calc(100vh - env(safe-area-inset-bottom)); +} + +.background { + width: 100%; + position: fixed; + top: 0; + left: 0; + height: 80rpx; + line-height: 80rpx; + z-index: 3; + text-align: center; + padding-top: 110rpx; + color: #fff; + font-size: 36rpx; +} + +.white { + background: #fff; + color: #333; +} + +.background .text { + height: 100%; +} + +.home-page-header, +.home-page-menu, +.home-page-container { + position: relative; + padding: 0 24rpx; +} + +.home-page-header { + padding-top: 230rpx; +} + +.home-page-header .bg { + height: 680rpx; + position: absolute; + top: 0; + left: 0; + z-index: -1; +} + +.home-page-header .bg .image { + height: 100%; +} + +.home-page-header .search .t-search__input-container { + height: 96rpx; + background: #fff !important; + font-size: 28rpx !important; +} + +.home-page-header .t-search__input { + font-size: 28rpx !important; + color: rgb(116, 116, 116) !important; +} + +.home-page-header .swiper-wrap { + margin-top: 30rpx; + margin-bottom: 10rpx; +} + +.home-page-menu .t-grid--card { + margin: 0; +} + .flex { display: flex; } @@ -15,6 +87,7 @@ margin-top: 20rpx; display: block; padding: 0 24rpx; + padding-bottom: calc(env(safe-area-inset-bottom) + 96rpx); } .tabCardPublic { @@ -79,11 +152,11 @@ } .body-info .name { - font-size: 32rpx; - height: 88rpx; + font-size: 30rpx; + height: 80rpx; color: #333333; font-weight: bold; - line-height: 44rpx; + line-height: 40rpx; display: -webkit-box; margin-bottom: 10rpx; -webkit-box-orient: vertical; @@ -101,6 +174,17 @@ font-size: 26rpx; display: flex; justify-content: space-between; + display: -webkit-box; + /* 浣跨敤寮规�х洅瀛愬竷灞�妯″瀷 */ + -webkit-line-clamp: 1; + /* 鎺у埗鏂囨湰鐨勮鏁� */ + -webkit-box-orient: vertical; + /* 璁剧疆鐩掑瓙鐨勫瓙鍏冪礌鎺掑垪鏂瑰悜 */ + overflow: hidden; + /* 瓒呭嚭閮ㄥ垎闅愯棌 */ + text-overflow: ellipsis; + /* 瓒呭嚭閮ㄥ垎鏄剧ず鐪佺暐鍙� */ + white-space: normal; } .body-info .price { @@ -132,17 +216,22 @@ .listBox1, .listBox2 { - padding: 50rpx 0; + padding: 30rpx 0; } .listBox1 .listItemBox { - height: 220rpx; + height: 210rpx; margin-bottom: 30rpx; } .listBox1 .specialSubject-img { - width: 400rpx; - height: 218rpx; + width: 480rpx; + height: 210rpx; + flex: 1; +} + +.listBox1 .body-info { + flex: 1; } .listBox1 .addCartImg, @@ -152,7 +241,7 @@ } .listBox1 .priceBox { - margin-top: 14rpx; + margin-top: 10rpx; } .listBox2 { @@ -164,7 +253,7 @@ } .listBox2 .booksListItemBox { - width: calc(100%/3 - 30rpx); + width: calc(100%/3 - 32rpx); margin-bottom: 30rpx; margin-right: 45rpx; } @@ -175,7 +264,7 @@ } .listBox2 .specialSubject-img { - height: 300rpx; + height: 280rpx; width: 100%; box-shadow: 0px 0px 20rpx 2px #f1f1f1; } @@ -185,9 +274,8 @@ } .listBox2 .author { - height: 30rpx; + height: 28rpx; color: #333333; - font-weight: bold; line-height: 30rpx; display: -webkit-box; margin-bottom: 10rpx; @@ -202,13 +290,17 @@ box-sizing: border-box; } +.listBox3 { + padding: 10rpx 0; +} + .listBox3 .textbooksItemBox { margin-bottom: 30rpx; } .listBox3 .textbooksItemBox .specialSubject-img { width: 190rpx; - height: 260rpx; + height: 250rpx; box-shadow: 0px 0px 20rpx 2px #f1f1f1; } @@ -217,7 +309,7 @@ } .listBox3 .name { - font-size: 32rpx; + font-size: 30rpx; height: 44rpx; color: #333333; font-weight: bold; @@ -248,4 +340,48 @@ .readList { overflow: auto; +} + +.rankingList .listItem { + padding: 20rpx 0; +} + +.srcolbox { + width: 100%; + height: 420rpx; + white-space: nowrap; +} + +.srcolbox .booksListItemBox { + display: inline-block; + width: 188rpx; + margin-right: 30rpx; +} + +.rankingList .specialSubject-img { + height: 254rpx; + width: 100%; + box-shadow: 0px 0px 20rpx 2px #f1f1f1; +} + +.rankingList .body-info { + padding: 20rpx 0; +} + +.rankingList .name { + height: 80rpx; + width: 188rpx; + color: #333333; + line-height: 40rpx; + display: -webkit-box; + /* 浣跨敤寮规�х洅瀛愬竷灞�妯″瀷 */ + -webkit-line-clamp: 2; + /* 鎺у埗鏂囨湰鐨勮鏁� */ + -webkit-box-orient: vertical; + /* 璁剧疆鐩掑瓙鐨勫瓙鍏冪礌鎺掑垪鏂瑰悜 */ + overflow: hidden; + /* 瓒呭嚭閮ㄥ垎闅愯棌 */ + text-overflow: ellipsis; + /* 瓒呭嚭閮ㄥ垎鏄剧ず鐪佺暐鍙� */ + white-space: normal; } \ No newline at end of file -- Gitblit v1.9.1