/* miniprogram/subpages/reality/pages/peopleHot/peopleHot.wxss */ .box{ width: 100%; height: auto; /* border: 1rpx solid red; */ box-sizing: border-box; } .hotbackground{ width: 100%; height: 270rpx; vertical-align: middle; box-sizing: border-box; } .tab{ width: 100%; height: 82rpx; line-height: 82rpx; background: #fff; display: flex; color: #999999; font-size: 30rpx; justify-content:space-around; } .seleted-color{ color: #29B9A5; font-size: 32rpx; font-weight: 600; } .tab-line{ height: 8rpx; line-height: 8rpx; display: flex; justify-content:space-around; background: #fff; } .line{ width: 30rpx; height: 8rpx; background: #29B9A5; border-radius: 4rpx; } .line1{ width: 30rpx; height: 8rpx; } .eventlist{ width: 100%; height: auto; margin-top: 20rpx; background: #fff; box-sizing: border-box; } /* 事件列表 */ .header { width: 100%; height: 92rpx; display: flex; justify-content: space-between; align-items: center; background: #fff; margin-top: 20rpx; padding: 31rpx 20rpx 31rpx 25rpx; box-sizing: border-box; } .header .title { font-size: 32rpx; color: #333; } .header .filter { display: flex; height: 100%; align-items: center; justify-content: flex-end; position: relative; } .header .hover-filter { background: #f7f7f7; } .header .filter .time { font-size: 26rpx; color: #B6BAC6; /* border: 1rpx solid red; */ } .header .filter .trigger { width: 0; height: 0; border: 13rpx solid transparent; border-top: 15rpx solid #B6BAC6; margin-left: 4rpx; position: relative; top: 10rpx; transition: transform 0.3s; transform-origin: 50% 7rpx; } .header .filter .time-select { width: 164rpx; position: absolute; left: -10rpx; top: 50rpx; background: #fff; z-index: 100; box-sizing: border-box; padding: 0 10rpx; box-shadow: 0px 3px 18px 0px rgba(211,211,211,0.63); overflow: hidden; transition: height 0.3s; } .header .filter .time-select .list-item { font-size: 26rpx; color: #B6BAC6; height: 50rpx; line-height: 50rpx; text-align: center; } .content{ width: 100%; height: auto; padding: 0 25rpx 0 21rpx; background: #fff; box-sizing: border-box; position: relative; } .list{ width: 100%; height: 110rpx; line-height: 110rpx; /* border: 1rpx solid red; */ color: #333333; font-size: 34rpx; box-sizing: border-box; border-top: 1rpx solid #EEEEEE; } .list .image{ width: 46rpx; height: 46rpx; vertical-align: middle; color: #333333; font-size: 34rpx; font-weight: bold; font-style: italic; text-align: center; } .image-margin{ margin-left: 10rpx; } .list .text{ width: 553rpx; margin-left: 25rpx; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; position: absolute; left: 70rpx; top: 8rpx; } .num,.attitude{ display: inline-block; position: absolute; right: 50rpx; top: 8rpx; } .num{ color: #F08526; font-size: 32rpx; top: -10rpx; } .attitude{ color: #B6BAC6; font-size: 22rpx; right: 49rpx; top: 24rpx; }