.top-menus { position: fixed; left: 0; right: 0; height: 80rpx; background: white; display: flex; justify-content: space-around; align-items: center; font-size: 30rpx; line-height: 80rpx; } page { background: #F2F2F2; } .top-menu.active { color: #E14135; position: relative; font-weight: 500; } .top-menu.active::after { content: "1"; font-size: 0; width: 40rpx; height: 6rpx; background: linear-gradient(270deg, #E14135, #FF9124); display: block; border-radius: 3rpx; position: absolute; left: 50%; margin-left: -20rpx; bottom: 10rpx; } .title-header { background: #fff !important; } .item { margin: 20rpx 30rpx; background: white; border-radius: 20rpx; font-size: 26rpx; } .item-top { display: flex; padding: 30rpx; } .item-top image { width: 160rpx; height: 160rpx; display: block; flex-shrink: 0; } .item-info { margin-left: 30rpx; color: #333333; display: flex; flex-direction: column; justify-content: space-between; flex: 1; height: 160rpx; width: 440rpx; } .item-info-top { font-size: 30rpx; } .item-title { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 6rpx; } .item-info-bottom { display: flex; justify-content: space-between; align-items: center; } .item-info-bottom text { color: #E14135; } .info-btn { width: 160rpx; text-align: center; line-height: 50rpx; height: 50rpx; background: linear-gradient(0deg, #E14135, #FF9124); border-radius: 25rpx; color: #fff; margin-left: 20rpx; } .list { padding-top: 80rpx; } .item-bottom { display: flex; padding: 20rpx 30rpx; border-top: 1rpx solid #d8d8d8; justify-content: flex-end; } .info-btn-new { background: #fff; border: 2rpx solid; color: #F34922; box-sizing: border-box; } .empty-btn { width: 240rpx; height: 80rpx; background: linear-gradient(0deg, #E14135, #FF9124); border-radius: 40rpx; line-height: 80rpx; text-align: center; color: #fff; margin-top: 100rpx; font-size: 30rpx; }