luoyangCoachApp/pages/tabbar/statistics/comp/comp.scss

.content {
		width: 100%;
		// background: url('http://192.168.1.20:81/zhili/image/20230824/30073140957f4349b6579cb0ff00d4b1.png') #F6F6F6 no-repeat;
		// background-size: 100% 492rpx;
		padding: 40rpx 28rpx 140rpx 28rpx;
	  .userInfo {
		  
	    .tit {
			font-size: 48rpx;
			color: #fff;
			font-weight: 500;
	    }
	
	    .userRow {
			align-items: center;
			margin-bottom: 20rpx;
	      .schoolIcon {
	        width: 28rpx;
			height: 28rpx;
	      }
	
	      .schoolName {
			font-size: 28rpx;
			padding: 20rpx;
			max-width: calc(100vw - 40rpx);
			color: #fff;
	      }
	
	      .tag {
			min-width: 112rpx;
			height: 44rpx;
			padding: 0 20rpx;
			background: #82AFDD;
			border-radius: 22rpx;
			font-size: 20rpx;
			color: #fff;
			line-height: 44rpx;
			text-align: center;
			white-space: nowrap;
			width: fit-content;
	      }
	    }
	  }
	
	  .priceBox {
		  padding: 32rpx;
		  color: $themC;
	    .blueLab {
			font-weight: 500;
			font-size: 28rpx;
	    }
	
	    .price {
			font-size: 56rpx;
			font-weight: 600;
			padding: 12rpx 0 24rpx 0;
	    }
		.toDay {
			padding: 14rpx 0;
			border-top: 2rpx dashed #E8E9EC;
			border-bottom: 2rpx dashed #E8E9EC;
			margin-bottom: 20rpx;
			.row {
				padding: 16rpx 0;
				display: flex;
				align-items: center;
				.lab {
					color: #686B73;
					font-size: 24rpx;
					width: 210rpx;
				}
				.val {
					font-size: 28rpx;
					font-weight: 600;
				}
			}
		}
	
	    .flex-b {
			
	      .data {
			font-size: 24rpx;
			color: #363A44;
	      }
	
	      .refresh {
			  width: 130rpx;
			  height: 60rpx;
			  background: rgba(25,137,250,0.1);
			  border-radius: 8rpx;
			  border: 2rpx solid #1989FA;
			  line-height: 60rpx;
			  display: flex;
			  align-items: center;
			  justify-content: center;
	        .text {
				font-size: 28rpx;
	        }
	
	        .icon {
	          width: 24rpx;
			  height: 24rpx;
			  margin-left: 6rpx;
	        }
	      }
	    }
	  }
	
	  .h1 {
		margin: 32rpx 0 24rpx 0;
	  }
	
	  .tabs {
		  display: flex;
		  justify-content: flex-start;
		  padding-bottom: 24rpx;
	    .tab {
			// width: 96rpx;
			padding: 12rpx 16rpx;
			// height: 60rpx;
			background: rgba(25,137,250,0.1);
			border-radius: 8rpx;
			border: 2rpx solid #1989FA;
			font-size: 28rpx;
			text-align: center;
			// line-height: 60rpx;
			color: $themC;
			margin-right: 30rpx;
			&.active {
				color: #fff;
				background-color: $themC;
			}
			&.long {
				min-width: 336rpx;
				width: fit-content !important;
			}
	    }
	  }
	
	  .card {
		  margin-bottom: 20rpx;
	    .chart {
	
	    }
	  }
	  .moreBtn {
			width: 200rpx;
			height: 60rpx;
			background: #FFFFFF;
			border-radius: 8rpx;
			border: 2rpx solid #E8E9EC;
			color: #ADADAD;
			text-align: center;
			line-height: 60rpx;
			margin: 32rpx auto 8rpx auto;
	  }
	}
	.chart {
		width:100%;
		height: 390rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
		padding: 28rpx;
	}
	
	.toDayServe {
		display: flex;
		justify-content: space-around;
		padding: 20rpx 0;
		.serveItem {
			width: 33%;
			width: 140rpx;
			height: 146rpx;
			background: rgba(25,137,250,0.06);
			border-radius: 12rpx;
			text-align: center;
			.lab {
				font-size: 24rpx;
				margin: 18rpx 0 16rpx 0;
			}
			.val {
				font-size: 56rpx;
				font-weight: 600;
			}
		}
	}