XEH-miniProgram/pages/self/order/index.scss

.page-wrap {
	padding-top: 82.42rpx;
}

.tabs-panel {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	height: 82.42rpx;
	background: #fff;
	display: flex;
	z-index: 1;

	&::before,
	&::after {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		height: 1rpx;
		background: #e0e0e0;
	}

	&::before {
		top: 0;
	}

	&::after {
		bottom: 0;
	}

	.item {
		flex: 1;
		text-align: center;
		font-size: 27.47rpx;
		color: #999;
		line-height: 82.42rpx;
		position: relative;

		& + .item::before {
			content: '';
			position: absolute;
			left: 0;
			top: 0;
			bottom: 0;
			width: 1rpx;
			background: #e0e0e0;
		}
	}

	.active {
		color: #00bcd2;

		&::after {
			content: '';
			position: absolute;
			left: 0%;
			right: 0%;
			bottom: 0%;
			height: 5.49rpx;
			background: #00bcd2;
			z-index: 1;
		}
	}
}

.order-panel {
	padding: 13.74rpx 0;
	.item {
		background: #fff;
		& + .item {
			margin-top: 13.74rpx;
		}
	}
	.head {
		display: flex;
		align-items: center;
		padding: 0 27.47rpx;
		height: 82.42rpx;
		border-bottom: 1rpx solid #e0e0e0;
		.icon {
			width: 35.71rpx;
			height: 35.71rpx;
		}
		.business {
			margin: 0 13.74rpx;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			flex: 1;
			font-size: 27.47rpx;
			color: #333;
		}
		.state {
			font-size: 27.47rpx;
			color: #f97631;
		}
	}
	.content {
		position: relative;
		height: 206.04rpx;
		padding: 27.47rpx 219.78rpx 27.47rpx 27.47rpx;
		box-sizing: border-box;
		.name {
			font-size: 32.97rpx;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			margin-bottom: 10.99rpx;
		}
		.text {
			font-size: 27.47rpx;
			color: #999;
		}
		.money {
			font-size: 27.47rpx;
			color: #666;
			white-space: nowrap;
			position: absolute;
			top: 96.15rpx;
			right: 27.47rpx;
		}
		.sub {
			position: absolute;
			right: 27.47rpx;
			top: 54.95rpx;
			font-size: 27.47rpx;
			color: #666;
		}
	}
}