.page{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #f7f7f7; } .head-bg{ position: relative; width: 100%; height: 220rpx; background: linear-gradient(#ff4f49,#fe7a61); } .header { display: flex;flex-direction: row;justify-content: center;align-items: center;color:$title; width:750rpx;height:calc(var(--status-bar-height) + 80rpx);padding-top:calc(var(--status-bar-height) + 0rpx);position: fixed;top:0;background-color: $base;z-index: 999; .title { font-size: 34rpx; } .left { position: absolute;left:20rpx; width:60rpx;height:60rpx;display: flex;justify-content: center;align-items: center; image { width:32rpx; } } } .bg001 { background-color: $base;width:750rpx;height:800rpx;position: fixed;top:0;z-index: -1; } .mainHeader { width:750rpx;height:250rpx; background-color: #fe7a61; .borderHeader { width:750rpx;height:0rpx; border-radius: 60rpx 60rpx 0rpx 0rpx; background-color: #f7f7f7; } } .bodyMain { width:750rpx; display: flex; align-items: center; justify-content: center;background-color: #f7f7f7; border-radius: 60rpx 60rpx 0rpx 0rpx;margin-top:-60rpx;padding-top: 80rpx; .nodata { display: flex;flex-direction: column;justify-content: center;align-items: center; font-size: 30rpx;color:$title50;padding-top: 200rpx; image { width:200rpx;margin-bottom: 50rpx; } } .list{ width: 100%; margin-bottom: 10px; .date{ display: flex; align-items: center; justify-content: center; width: 100%; height: 100rpx; text{ padding: 10rpx 30rpx; background-color: rgba(0,0,0,0.2); color: #FFFFFF; font-size: 26rpx; border-radius: 10rpx; } } .item{ padding: 0 4%; height: 240rpx; border-radius: 10rpx; .title{ display: flex; justify-content: space-between; align-items: center; width: 100%; height: 80rpx; text{ font-size: 32rpx; color: #222222; } } .describe{ display: flex; align-items: center; width: 100%; height: 100rpx; text{ font-size: 28rpx; color: #959595; } } .tdate { padding-top: 12rpx; font-size: 26rpx; color: #959595; } } } }