page { background-color: #f8f8f8; } .event_hader_tabs { position: fixed; top: 0; left: 0; right: 0; background-color: #fff; z-index: 100; } .event_content { padding: 100rpx 30rpx 0 30rpx; padding-bottom: calc(130rpx + constant(safe-area-inset-bottom)); padding-bottom: calc(130rpx + env(safe-area-inset-bottom)); } .event_content .event_item { background-color: #fff; border-radius: 20rpx; overflow: hidden; margin-top: 30rpx; } .event_content .event_item .event_item_img { height: 306rpx; position: relative; text-align: center; } .event_content .event_item .event_item_img .event_item_img_default { padding-top: 15%; } .event_content .event_item .event_item_img .event_item_status { position: absolute; left: 0; top: 0; color: #fff; border-top-left-radius: 20rpx; border-bottom-right-radius: 20rpx; font-size: 24rpx; height: 50rpx; line-height: 50rpx; } .event_content .event_item .event_item_img .event_item_status_Pending { background-color: #ffa100; } .event_content .event_item .event_item_img .event_item_status_InProgress { background-color: #4096ff; } .event_content .event_item .event_item_img .event_item_status_Completed { background-color: #939393; } .event_content .event_item image { width: 100%; height: 306rpx; border-top-left-radius: 20rpx; border-top-right-radius: 20rpx; } .event_content .event_item .event_item_name { padding: 15rpx 30rpx; font-size: 28rpx; color: #333; } .event_content .event_item .event_item_data { padding: 0 30rpx 20rpx 30rpx; color: #666666; font-size: 24rpx; }