更新 'pages/painting/draw.scss'

pages/painting/draw.scss

@@ -14,8 +14,8 @@
 	// padding-left: 28rpx;
 			display: flex;
 			flex-wrap: wrap;
-			// justify-content: space-between;
-			
+			 justify-content: space-between;
+			flex-wrap: wrap;
 			width: 100%;
 			
 			
@@ -29,12 +29,13 @@
 				border: 4rpx solid #1F79F0;
 			}
 			.item{
-				margin-right: 18rpx;
+				// margin-right: 18rpx;
 				// width: 20.8vw;
-				
-				width: 22.3%;
+				width: 23%;
+				// background-color: red;
+				// width: 22.3%;
 				// min-height: 212rpx;
-				
+				height: 260rpx;
 				margin-bottom: 20rpx;
 				display: flex;
 				flex-direction: column;
@@ -43,16 +44,25 @@
 				align-items: center;
 				.top{
 					width: 100%;
-					height: 100%;
+					 height: 100%;
+					 
+					 		overflow: hidden;
 					border-radius: 20rpx;
 					
-					height: 212rpx;
+					 // height: 412rpx;
 					
 					position:relative;
 					
 					// background: url(https://img0.baidu.com/it/u=1641416437,1150295750&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800);
 					
-					background-size: 100% 100%;
+					 background-size: 100% 100%;
+				.img{
+			position: absolute;
+			width: 100%;
+			display: block;
+			top: 0;
+			// margin-bottom: 0rpx;
+				}
 					.tag{
 						width: 62rpx;
 						height: 42rpx;
@@ -63,11 +73,12 @@
 					}
 				}
 				.name{
-					font-size: 30rpx;
+					font-size: 24rpx;
 					font-family: PingFang-SC, PingFang-SC;
 					font-weight: 500;
-					color: #333333;
-					margin-top: 6rpx;
+					 color: #333333;
+					// color: red;
+					// margin-top: 6rpx;
 					
 					
 					white-space: nowrap;
@@ -87,7 +98,7 @@
 	padding-left: 28rpx;
 			display: flex;
 			flex-wrap: wrap;
-			// justify-content: space-between;
+			 justify-content: space-between;
 			
 			width: 100%;
 			
@@ -100,12 +111,16 @@
 			
 			.item_a{
 				border: 4rpx solid #1F79F0;
+				.img{
+					width: 100%;
+				}
 			}
 			.item{
 				margin-right: 18rpx;
 				// width: 20.8vw;
-				
-				width: 22.3%;
+				width: 22%;
+				// background-color: beige;
+				// width: 22.3%;
 				// min-height: 212rpx;
 				
 				margin-bottom: 20rpx;
@@ -115,17 +130,20 @@
 				justify-content: center;
 				align-items: center;
 				.top{
-					width: 100%;
-					height: 100%;
+					 width: 100%;
+					// height: 100%;
 					border-radius: 20rpx;
-					
+					// background-color: #207CF7;
 					height: 212rpx;
-					
+					overflow: hidden;
 					position:relative;
 					
 					// background: url(https://img0.baidu.com/it/u=1641416437,1150295750&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800);
 					
 					background-size: 100% 100%;
+					.img{
+						width: 100%;
+					}
 					.tag{
 						width: 62rpx;
 						height: 42rpx;
@@ -139,7 +157,8 @@
 					font-size: 30rpx;
 					font-family: PingFang-SC, PingFang-SC;
 					font-weight: 500;
-					color: #333333;
+					// color: #333333;
+
 					margin-top: 6rpx;
 					
 					
@@ -162,34 +181,30 @@ padding-bottom: 170rpx;
 	.selBox{
 		// background: red;
 		position: relative;
-		.line{
-			border-bottom: 1rpx solid #E7E7E7;
-			width: calc(100% - 28rpx);
-			margin-left: 50%;
-			transform: translateX(-50%);
-			margin-top: 32rpx;
-		}
+	
 		.tipAndUpBox{
 			box-sizing: border-box;
 			// background: red;
 			display: flex;
 			padding-left: 28rpx;
-			
+			// width: 100%;
 			margin-top: 24rpx;
-			
+			 // background-color: #6f2fdb;
 			.left{
 				font-size: 28rpx;
 				font-family: PingFang-SC, PingFang-SC;
 				font-weight: 500;
 				color: #333333;
-				
-				width: 256rpx;
-				
-				padding-top: 20rpx;
+				// padding-top: 30rpx;
+				box-sizing: border-box;
+				// width: 700rpx;
+				 // background-color: blue;
+				padding-top: 50rpx;
 				.xxsm{
 					cursor: pointer;
 				}
 				.item{
+					width: 200rpx;
 					margin-bottom: 32rpx;
 					display: flex;
 					align-items: center;
@@ -210,6 +225,21 @@ padding-bottom: 170rpx;
 					}
 				}
 			}
+			.upList{
+				// flex: 1;
+				 // background-color: #00ca88;
+			// width: 30%;
+				box-sizing: border-box;
+				.upBox{
+		width:49%;
+// justify-content: space-evenly;
+ // display: flex;
+
+.up{
+	 // width: 49%;
+	// background-color: #207CF7;
+}	}
+			}
 		}
 		.addPo{
 			position: relative;
@@ -322,7 +352,7 @@ padding-bottom: 170rpx;
 					font-family: PingFang-SC, PingFang-SC;
 					font-weight: 500;
 					color: #333333;
-					
+					// background-color: #549DFF;
 					.arrD{
 						width: 23rpx;
 						height: 14rpx;
@@ -351,6 +381,21 @@ padding-bottom: 170rpx;
 				
 		}
 	}
+	// .line{
+	// 	border-bottom: 1rpx solid #E7E7E7;
+	// 	width: calc(100% - 28rpx);
+	// 	margin-left: 50%;
+	// 	transform: translateX(-50%);
+	// 	margin-top: 32rpx;
+	// 	// background-color: red;
+	// 	padding-left: 24rpx;
+	// 	img{
+	// 		width: 28rpx;
+	// 		height: 28rpx;
+	// 		margin-right: 8rpx;
+	// 		margin-top: 6rpx;
+	// 	}
+	// }
 	.upTitle{
 			font-size: 30rpx;
 			font-family: PingFang-SC, PingFang-SC;
@@ -365,18 +410,27 @@ padding-bottom: 170rpx;
 			align-items: center;
 			// margin-top: 24rpx;
 			// padding-left: 28rpx;
-			
+			// width: 70%;
+			// width: 500rpx;
+			flex: 1;
+			// background-color: red;
+			display: flex;
+			justify-content: space-between;
 			.upBox{
 				display: flex;
 				flex-direction: column;
 				align-items: center;
 				justify-content: center;
 				margin-right: 32rpx;
-				width: 212rpx;
-				height: 330rpx;
+				// width: 212rpx;
+				 height: 400rpx;
+				width: 49%;
+				display: flex;
+				// background-color: #00BCD4;
 				.up{
-					width: 100%;
-					height: 100%;
+					// width: 100%;
+					// height: 100%;
+					width: 49%;
 					background: #F4F4F4;
 					border-radius: 20rpx;
 					
@@ -430,12 +484,34 @@ padding-bottom: 170rpx;
 					border: 4rpx solid #1F79F0;
 				}
 				.up1{
-					background: url(@/static/modal.png);
-					background-size: cover;
+					// background: url(@/static/modal.png);
+					background-color: red;
+					 // background-size: contain;
+			width: 100%;
 					background: #F4F4F4;
-					background-size: 100% 100%;
+					 // background-size: 50% 50%;
+					 // background-size: contain;
+					 background-size:100% 100%;
+						// width: 120px;
+						height: 350px;
+						overflow: hidden;
+						position: relative;
+				.img{
+				width: 100%;
+				position: absolute;
+				top: 0;
+					// width: 100%;
+				}
 				}
 				.up2{
+					background-color: red;
+					background-size: cover;
+					background: #F4F4F4;
+					background-size: 100% 100%;
+						// width: 120px;
+								width: 100%;
+						height: 350px;
+						overflow: hidden;
 					background-size: 100% 100%;
 				}
 				
@@ -451,7 +527,7 @@ padding-bottom: 170rpx;
 		.tipBox{
 			display: flex;
 			align-items: flex-start;
-			
+			line-height: 33rpx;
 			font-size: 24rpx;
 			font-family: PingFang-SC, PingFang-SC;
 			font-weight: 500;
@@ -507,7 +583,7 @@ padding-bottom: 170rpx;
 		}
 		img{
 			width: 28rpx;
-			height: 28rpx;
+			// height: 28rpx;
 		}
 		span{
 			margin-left: 8rpx;
@@ -560,7 +636,7 @@ padding-bottom: 170rpx;
 			display: flex;
 			justify-content: center;
 			align-items: center;
-			width: 242rpx;
+			width: 300rpx;
 			height: 76rpx;
 			background: #FFFFFF;
 			border-radius: 38rpx;
@@ -569,6 +645,7 @@ padding-bottom: 170rpx;
 			font-family: PingFang-SC, PingFang-SC;
 			font-weight: 500;
 			color: #207CF7;
+			
 		}
 		.right{
 			display: flex;
@@ -1235,6 +1312,278 @@ padding-bottom: 170rpx;
 
 	.directask {
 		padding: 14rpx 30rpx 250rpx;
+	.mj-new-leader{
+		height: 45px;
+		width: 100%;
+		position: fixed;
+		z-index: 9999;
+		top: 0;
+		left: 0;
+		// background-color: red;
+	
+		.mj-bg{
+			position: absolute;
+			width: 100vw;
+			height: 100vh;
+			left: 0;
+			top: 0;
+			z-index: 1000;
+			background-color:rgba(0, 0, 0, .7);
+			.MjNewshow{
+				// width: 674rpx;
+				width: 100vw;
+				height: 1134rpx;
+				margin-top: 72rpx;
+				background-size: 100% 100%;
+				position: relative;
+			}
+		}
+		.mj-next-btn{
+			  // background-color: blue;
+			width: 300rpx;
+							height: 80rpx;
+					
+					z-index: 2000;		
+							position: absolute;
+							right: 70rpx;
+							top: 420rpx;
+		}
+	}
+	// .addmask{
+	// 	height: 45px;
+	// 	width: 100%;
+	// 	// background: red;
+	// 	position: fixed;
+	// 	z-index: 9999;
+	// 	top: 0;
+	// 	left: 0;
+		
+	// 	.leadBg{
+	// 		position: absolute;
+			
+	// 		width: 100vw;
+	// 		height: 100vh;
+	// 		// width: 100%;
+	// 		// height: 100%;
+	// 		left: 0;
+	// 		top: 0;
+	// 		z-index: 9999;
+	// 		background: rgba(0, 0, 0, .69);
+	// 		// padding-left: 38rpx;
+	// 		// padding-right: 38rpx;
+			
+	// 		display: flex;
+	// 		justify-content: center;
+	// 		.leadBox1{
+	// 			// margin-bottom: 138rpx;
+	// 			width: 674rpx;
+	// 			height: 1134rpx;
+	// 			// background-image: url(@/static/hh_lead1.png);
+	// 			background-size: cover;
+	// 			margin-top: 100rpx;
+	// 			position: relative;
+				
+	// 			.nextBtn{
+	// 				width: 350rpx;
+	// 				height: 140rpx;
+	// 				// background: red;
+					
+	// 				position: absolute;
+	// 				right: 0;
+	// 				bottom: 0rpx;
+	// 			}
+	// 		}
+	// 		.leadBox2{
+	// 			width: 674rpx;
+	// 			// width: 100%;
+	// 			height: 902rpx;
+	// 			// background-image: url(@/static/hh_lead_2.png);
+	// 			background-size: cover;
+	// 			margin-top: 200rpx;
+	// 			position: relative;
+				
+	// 			.nextBtn{
+	// 				width: 350rpx;
+	// 				height: 140rpx;
+	// 				// background: green;
+	// 				position: absolute;
+	// 				right: 0;
+	// 				top:250rpx;
+	// 			}
+	// 		}
+	// 	}
+	// }
+	
+	.block_1 {
+	  background-color: rgba(0, 0, 0, 0.69);
+	  position: relative;
+	  width: 375px;
+	  height: 824px;
+	}
+	
+	.text-wrapper_3 {
+	  width: 139px;
+	  height: 51px;
+	  margin: 249px 0 0 208px;
+	}
+	
+	.text_1 {
+	  width: 12px;
+	  height: 42px;
+	  -webkit-text-stroke: 1px rgba(32, 124, 247, 1);
+	  overflow-wrap: break-word;
+	  color: rgba(32, 124, 247, 1);
+	  font-size: 32px;
+	  font-family: Impact;
+	  font-weight: normal;
+	  text-align: right;
+	  white-space: nowrap;
+	  line-height: 42px;
+	  margin-top: 9px;
+	}
+	
+	.text_2 {
+	  width: 112px;
+	  height: 42px;
+	  -webkit-text-stroke: 1px rgba(32, 124, 247, 1);
+	  overflow-wrap: break-word;
+	  color: rgba(32, 124, 247, 1);
+	  font-size: 28px;
+	  font-family: SourceHanSansCN-Bold;
+	  font-weight: 700;
+	  text-align: right;
+	  white-space: nowrap;
+	  line-height: 42px;
+	  margin-left: 2px;
+	}
+	
+	.text_3 {
+	  width: 12px;
+	  height: 42px;
+	  -webkit-text-stroke: 1px rgba(32, 124, 247, 1);
+	  overflow-wrap: break-word;
+	  color: rgba(32, 124, 247, 1);
+	  font-size: 32px;
+	  font-family: Impact;
+	  font-weight: normal;
+	  text-align: right;
+	  white-space: nowrap;
+	  line-height: 42px;
+	  margin: 9px 0 0 1px;
+	}
+	
+	.text-wrapper_4 {
+	  width: 273px;
+	  height: 42px;
+	  margin: 38px 0 0 74px;
+	}
+	
+	.text_4 {
+	  width: 12px;
+	  height: 42px;
+	  -webkit-text-stroke: 1px rgba(255, 255, 255, 1);
+	  overflow-wrap: break-word;
+	  color: rgba(255, 255, 255, 1);
+	  font-size: 32px;
+	  font-family: Impact;
+	  font-weight: normal;
+	  text-align: right;
+	  white-space: nowrap;
+	  line-height: 42px;
+	}
+	
+	.text_5 {
+	  width: 12px;
+	  height: 42px;
+	  -webkit-text-stroke: 1px rgba(255, 255, 255, 1);
+	  overflow-wrap: break-word;
+	  color: rgba(255, 255, 255, 1);
+	  font-size: 32px;
+	  font-family: Impact;
+	  font-weight: normal;
+	  text-align: right;
+	  white-space: nowrap;
+	  line-height: 42px;
+	}
+	
+	.group_2 {
+	  position: relative;
+	  width: 134px;
+	  height: 40px;
+	  margin: 19px 0 0 198px;
+	}
+	
+	.text_6 {
+	  width: 60px;
+	  height: 20px;
+	  overflow-wrap: break-word;
+	  color: rgba(255, 255, 255, 1);
+	  font-size: 20px;
+	  font-family: PingFang-SC-Bold;
+	  font-weight: normal;
+	  text-align: center;
+	  white-space: nowrap;
+	  line-height: 20px;
+	  margin: 10px 0 0 37px;
+	}
+	
+	.box_3 {
+	  border-radius: 20px;
+	  position: absolute;
+	  left: 0;
+	  top: 0;
+	  width: 134px;
+	  height: 40px;
+	  border: 1.5px rgba(255, 255, 255, 1);
+	}
+	
+	.image_1 {
+	  width: 62px;
+	  height: 62px;
+	  margin: 14px 0 0 180px;
+	}
+	
+	.box_4 {
+	  background-color: rgba(226, 248, 255, 1);
+	  border-radius: 8px;
+	  height: 150px;
+	  width: 321px;
+	  margin: 7px 0 152px 27px;
+	}
+	
+	.group_1 {
+	  border-radius: 4px;
+	  background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/b77abb66bceb4bed841fa360ed919dd4_mergeImage.png);
+	  width: 301px;
+	  height: 129px;
+	  margin: 10px 0 0 10px;
+	}
+	
+	.paragraph_1 {
+	  position: absolute;
+	  left: 54px;
+	  top: 291px;
+	  width: 280px;
+	  height: 84px;
+	  -webkit-text-stroke: 1px rgba(255, 255, 255, 1);
+	  overflow-wrap: break-word;
+	  color: rgba(255, 255, 255, 1);
+	  font-size: 28px;
+	  font-family: SourceHanSansCN-Bold;
+	  font-weight: 700;
+	  text-align: right;
+	  line-height: 42px;
+	}
+	
+	.box_5 {
+	  border-radius: 27px;
+	  position: absolute;
+	  left: 193px;
+	  top: 394px;
+	  width: 144px;
+	  height: 50px;
+	  border: 1.5px rgba(255, 255, 255, 1);
+	}
 	}
 
 	.dygbhg {