.page{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .my-top{ position: absolute; width: 100%; height: 300rpx; /* #ifdef MP */ height: 360rpx; /* #endif */ overflow: hidden; .head{ position: fixed; left: 0; top: 0; z-index: 100; display: flex; align-items: center; justify-content: space-between; width: 100%; height: 100rpx; /* #ifdef APP-PLUS */ height: calc(100rpx + var(--status-bar-height)); padding-top: var(--status-bar-height); /* #endif */ /* #ifdef MP */ height: calc(120rpx + var(--status-bar-height)); padding-top: calc(40rpx + var(--status-bar-height)); /* #endif */ background-color: rgba(255,255,255,0); .logo-title{ width: 40%; color: #fff; padding-left: 20rpx; image { width: 169rpx; height: 40rpx; margin-left: 10rpx; } } .setting-mess{ width: 20%; display: flex; align-items: center; height: 100%; margin-right: 20rpx; .setting{ display: flex; justify-content: center; align-items: center; width: 80rpx; height: 100%; text{ font-size: 38rpx; } } .mess{ display: flex; justify-content: center; align-items: center; width: 80rpx; height: 100%; text{ font-size: 38rpx; } } } } } .main { position: relative; top: 90rpx; padding-bottom: 150rpx; /* #ifdef MP */ top: 170rpx; padding-bottom: 200rpx; /* #endif */ margin: 0 20rpx; } .message-list{ padding: 0 4%; background-color: #FFFFFF; border-radius: 20rpx; margin-bottom: 20rpx; .list{ display: flex; align-items: center; justify-content: space-between; width: 100%; height: 160rpx; border-bottom: 2rpx dashed #E8E8F0; .icon-data{ display: flex; align-items: center; width: 80%; height: 100%; .icon{ display: flex; align-items: center; justify-content: center; width: 90rpx; height: 90rpx; image{ width: 90rpx; height: 90rpx; border-radius: 100rpx; } } .data{ margin-left: 20rpx; .title{ display: flex; width: 100%; text{ font-size: 28rpx; color: #222222; } } .describe{ width: 100%; margin-top: 10rpx; text{ font-size: 24rpx; color: #afafaf; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis; } } } } .more{ text-align: right; .more-num { display: inline-block; background-color: #f04746; border-radius: 100rpx; color: #fff; font-size: 20rpx; width: 36rpx; height: 36rpx; text-align: center; line-height: 36rpx; } .icon-more { margin-top: 14rpx; font-size: 28rpx; color: #afafaf; } } } .list:last-child { border-bottom: 0; } } .bidding-title { display: flex; align-items: center; font-size: 30rpx; font-weight: bold; padding: 40rpx 0 0 0; color: #000; .bidding-title-line { width: 14rpx; height: 30rpx; border-radius: 80rpx; background: -webkit-gradient(linear, top top, bottom top, from(#30a738), to(#4dcc56)); background: -o-linear-gradient(top, #30a738, #4dcc56); background: linear-gradient(to top, #30a738, #4dcc56); margin-right: 20rpx; box-shadow: 0 5rpx 10rpx #ace2b0; } text { font-size: 24rpx; margin-left: 10rpx; } }