<!--
 * @Author: ch
 * @Date: 2022-03-21 18:08:07
 * @LastEditors: ch
 * @LastEditTime: 2022-03-21 18:28:55
 * @Description: file content
-->
<template>
	<view>
		<view class="banner"></view>
		<view class="tab">
			<view class="tab--item">
				<text class="tab--time">16:00</text>
				<text>已开抢</text>
			</view>
			<view class="tab--item tab--item__active">
				<text class="tab--time">18:00</text>
				<text>已结束</text>
			</view>
			<view class="tab--item">
				<text class="tab--time">20:00</text>
				<text>即将开抢</text>
			</view>
			<view class="tab--item">
				<text class="tab--time">20:00</text>
				<text>即将开抢</text>
			</view>
			<view class="tab--item">
				<text class="tab--time">20:00</text>
				<text>即将开抢</text>
			</view>
		</view>
		<view class="list"></view>
	</view>
</template>
<style lang="scss" scoped>
page{
	background: #F53739;
}
.banner{
	height: 678rpx;
}
.tab{
	height:120rpx;
	margin: 0 18rpx;
	background: linear-gradient(180deg, #FDDBAE 0%, #FEC793 25%, #FFB378 97%, #FFB378 100%);
	display: flex;
	justify-content: space-around;
	align-items: center;
	text-align: center;
	&--item{
		font-size: 24rpx;
		line-height: 45rpx;
		color: #EF6817;
		&__active{
			color: #F53739;
		}
	}
	&--time{
		display: block;
		font-size: 32rpx;
	}
}
.list{
	margin: 0 20rpx;
	padding: 30rpx;
}
</style>