浏览代码

Merge remote-tracking branch 'origin/2025鹅状元数学' into 2025鹅状元数学

wangxy 2 周之前
父节点
当前提交
9d893fee38

+ 9 - 0
common/styles/global/components.scss

@@ -872,4 +872,13 @@ $titleBar-tabBar-page: calc(100vh - var(--status-bar-height));
 	background-image: url("@/static/images/phone/wordView/exam-tip-bj.png");
 	color: #08457b;font-size: 36rpx;z-index: 3;padding: 180rpx 0 0 100rpx;
 	position: absolute;left: 0;right: 0;bottom: var(--window-bottom);
+	
+	@include mediaSmall() {
+		width: 750rpx;height: 271rpx;font-size: 22rpx;padding: 140rpx 0 0 200rpx;
+		background-image: url("@/static/images/pad/wordView/exam-tip-bj.png");
+	}
+	@include mediaBig() {
+		width: 2048rpx;height: 740rpx;font-size: 62rpx;padding: 360rpx 0 0 480rpx;
+		background-image: url("@/static/images/pad/wordView/exam-tip-bj.png");
+	}
 }

+ 386 - 125
common/styles/global/pages.scss

@@ -988,20 +988,21 @@
 			width: 715rpx;margin: 0 auto 16rpx;padding: 47rpx 16rpx 16rpx 16rpx;
 			border-radius: 10rpx;position: relative;
 			.card-body-box{
-				img{width: 124rpx;height: 157rpx;border-radius: 10rpx;}
+				img{width: 124rpx;height: 157rpx;border-radius: 10rpx;flex-shrink: 0;margin-right: 16rpx;}
 				.body-right{
-					margin-left: 16rpx;font-size: 20rpx;display: block;
-					.right-name{font-size: 22rpx;margin: 5rpx 0;}
-					.right-item{width: 50%;display: inline-block;vertical-align: middle;margin: 5rpx 0;}
-					.right-item-mini{width: 40%;}
+					width: calc(100% - 140rpx);margin-left: 0;font-size: 20rpx;display: block;
+					.right-name{font-size: 22rpx;margin: 5rpx 0;@include single-line-ellipsis;}
+					.right-item{width: 49%;display: inline-block;vertical-align: middle;
+					margin: 5rpx 0;@include single-line-ellipsis;}
+					.right-item-all{width: 100%;margin: 5rpx 0;@include single-line-ellipsis;}
 				}
 			}
 			.card-progress-box{
-				position: absolute;bottom: 12rpx;left:140rpx;right: 10rpx;margin-top: 0;
-				.xx-progress-box{margin-right: 42rpx;font-size: 18rpx;}
+				position: absolute;bottom: 16rpx;left:156rpx;right: 10rpx;margin-top: 0;
+				.xx-progress-box{margin-right: 24rpx;font-size: 18rpx;}
 				.xx-progress{margin-top: 0;}
 				.progress-title{display: none;}
-				.jxxx-btn{width: 104rpx;height: 50rpx;margin-right: 16rpx;}
+				.jxxx-btn{width: 100rpx;height: 46rpx;margin-right: 16rpx;}
 			}
 		}
 		.xxjl-card-box::before{width: 188rpx;height: 50rpx;line-height: 50rpx;top: -18rpx;font-size: 22rpx;}
@@ -1055,21 +1056,21 @@
 			width: 1940rpx;margin: 0 auto 38rpx;padding: 115rpx 38rpx 38rpx 38rpx;
 			border-radius: 26rpx;position: relative;
 			.card-body-box{
-				img{width: 304rpx;height: 387rpx;border-radius: 26rpx;}
+				img{width: 304rpx;height: 387rpx;border-radius: 26rpx;margin-right: 42rpx;}
 				.body-right{
-					margin-left: 38rpx;font-size: 46rpx;
+					width: calc(100% - 330rpx);font-size: 46rpx;
 					.right-name{font-size: 54rpx;margin: 16rpx 0;}
 					.right-item{width: 50%;display: inline-block;vertical-align: middle;margin: 16rpx 0;}
 					view{margin: 16rpx 0;}
-					.right-item-mini{width: 40%;}
+					.right-item-all{margin: 16rpx 0;}
 				}
 			}
 			.card-progress-box{
-				position: absolute;bottom: 36rpx;left:360rpx;right: 16rpx;
-				.xx-progress-box{margin-right: 102rpx;font-size: 45rpx;}
+				position: absolute;bottom: 40rpx;left:380rpx;right: 16rpx;
+				.xx-progress-box{margin-right: 64rpx;font-size: 45rpx;}
 				.xx-progress{margin-top: 0;}
 				.progress-title{display: none;}
-				.jxxx-btn{width: 263rpx;height: 122rpx;margin-right: 38rpx;}
+				.jxxx-btn{width: 254rpx;height: 110rpx;margin-right: 38rpx;}
 			}
 		}
 		.xxjl-card-box::before{width: 462rpx;height: 123rpx;line-height: 123rpx;top: -45rpx;font-size: 54rpx;}
@@ -2457,7 +2458,7 @@
 		margin-top: 24rpx;box-sizing: border-box;padding:0 24rpx;
 		.types-item{
 			width: 80rpx;height: 80rpx;line-height: 80rpx;text-align: center;box-sizing: content-box;
-			background-color: #fff;color: #999;border-radius: 50%;border: 1rpx solid #ccc;}
+			background-color: #fff;color: #999;border-radius: 50%;border: 1rpx solid #ccc;font-size: 32rpx;}
 		.types-item.active{background-color: #659ff1;color: #fff;
 		border: 1rpx solid #659ff1;box-shadow: 0 0 10rpx rgba(100, 159, 241, 0.9);}
 		.jt-item{width: 24rpx;height: 24rpx;@include ezy-no-repeat-contain;
@@ -2510,7 +2511,7 @@
 	// 音标播放
 	.yb-play-box{
 		background-color: #dcf7fe;display: inline-block;margin: 32rpx auto 0;
-		padding: 4rpx 24rpx 10rpx;border-radius: 30rpx;
+		padding: 4rpx 24rpx 10rpx;border-radius: 30rpx;font-size: 0;
 		text{font-size: 34rpx;display: inline-block;vertical-align: middle;}
 		text:nth-child(even){color: #3c7efd;margin: 0 10rpx;}
 		icon{width: 30rpx;height:30rpx;@include ezy-no-repeat-cover;margin-left: 24rpx;
@@ -2557,112 +2558,119 @@
 	.word-color{color: #3a7fe9;}
 	.details-cn-content{color: #666;margin: 16rpx 12rpx 24rpx;}
 	
+	&::before,&::after{
+		content: '';width: 29rpx;height: 42rpx;z-index: 5;
+		background-image: url("@/static/images/common/wordView/jt-icon.png");
+		@include ezy-no-repeat-cover;display: block;
+		position: absolute;top: 46%;
+	}
+	&::before{left: 60rpx;}
+	&::after{right: 60rpx;transform: rotate(180deg);}
+	
 	@include mediaSmall() {
-			.word-view-border{margin: 21rpx 16rpx 16rpx;border-radius: 10rpx;}
-			.select-words-box{
-				height: 43rpx;font-size: 20rpx;
-				.words-item{padding: 10rpx 6rpx;}
-			}
-			.select-types-box{
-				margin-top: 16rpx;padding: 0 16rpx;
-				.types-item{width: 52rpx;height: 52rpx;line-height: 52rpx;}
-				.jt-item{width: 16rpx;height: 16rpx;}
-			}
-			.word-view-bottom{
-				height: 78rpx;border-top: 5rpx solid #a2c6ff;padding: 0 16rpx;font-size: 18rpx;
-				.collect-btn{
-					icon{width: 27rpx;height: 27rpx;margin-bottom: 4rpx;}
-				}
-				.bottom-btn-box{
-					.word-view-btn{width: 133rpx;height: 50rpx;line-height: 50rpx;}
-					.word-view-btn + .word-view-btn{margin-left: 20rpx;}
-				}
+		.word-view-border{margin: 21rpx 16rpx 16rpx;border-radius: 10rpx;}
+		.select-words-box{
+			height: 43rpx;font-size: 18rpx;
+			.words-item{padding: 10rpx 6rpx;}
+		}
+		.select-types-box{
+			margin-top: 16rpx;padding: 0 16rpx;justify-content: center;
+			.types-item{width: 52rpx;height: 52rpx;line-height: 52rpx;font-size: 21rpx;}
+			.jt-item{width: 16rpx;height: 16rpx;margin: 0 24rpx;}
+		}
+		.word-view-bottom{
+			height: 78rpx;border-top: 5rpx solid #a2c6ff;padding: 0 16rpx;font-size: 18rpx;
+			.collect-btn{
+				icon{width: 27rpx;height: 27rpx;margin-bottom: 4rpx;}
+			}
+			.bottom-btn-box{
+				.word-view-btn{width: 133rpx;height: 50rpx;line-height: 50rpx;}
+				.word-view-btn + .word-view-btn{margin-left: 20rpx;}
 			}
-			.pin-words-explain-box{
-				margin-top: 42rpx;
-				.words-explain-item{font-size: 22rpx;padding: 0 10rpx;}
-				.words-explain-item + .words-explain-item{margin-top: 8rpx;}
-			}
-			.audio-play-btn,.audio-playing-btn{width: 72rpx;height: 72rpx;margin: 36rpx auto 0;}
-			.pin-tip{width: 364rpx;margin: 16rpx auto 0;font-size: 17rpx;padding: 6rpx 0;}
-			.clean-btn{width: 111rpx;height: 38rpx;margin: 16rpx auto 0;}
-			.yb-play-box{
-				margin: 21rpx auto 0;padding: 3rpx 16rpx 6rpx;border-radius: 20rpx;
-				text{font-size: 22rpx;}
-				text:nth-child(even){margin: 0 6rpx;}
-				icon{width: 20rpx;height: 20rpx;margin-left: 16rpx;}
-			}
-			.word-circle-box{
-				font-size: 53rpx;margin: 27rpx auto 0;
-				.word-link-box{padding: 9rpx 31rpx 23rpx;}
-				.word-link-box::before,.word-link-box::after{height: 27rpx;}
-				text:not(:first-child)::before{width: 6rpx;height: 6rpx;margin: 0 4rpx;}
-			}
-			.details-title{padding: 5rpx 8rpx;font-size: 16rpx;}
-			.details-content-box{padding: 10rpx;font-size: 17rpx;margin-bottom: 10rpx;}
-			.syky-content{margin: 10rpx 0 23rpx;}
-			.syky-content:last-child{margin: 10rpx 0;}
-			.details-en-content{margin: 10rpx 8rpx;}
-			.details-cn-content{margin: 10rpx 8rpx 16rpx;}
 		}
+		.pin-words-explain-box{
+			margin-top: 42rpx;
+			.words-explain-item{font-size: 22rpx;padding: 0 10rpx;}
+			.words-explain-item + .words-explain-item{margin-top: 8rpx;}
+		}
+		.audio-play-btn,.audio-playing-btn{width: 72rpx;height: 72rpx;margin: 36rpx auto 0;}
+		.pin-tip{width: 364rpx;margin: 24rpx auto 0;font-size: 17rpx;padding: 6rpx 0;}
+		.clean-btn{width: 111rpx;height: 38rpx;margin: 16rpx auto 0;}
+		.yb-play-box{
+			margin: 21rpx auto 0;padding: 4rpx 16rpx 6rpx;border-radius: 20rpx;
+			text{font-size: 22rpx;}
+			text:nth-child(even){margin: 0 6rpx;}
+			icon{width: 20rpx;height: 20rpx;margin-left: 16rpx;}
+		}
+		.word-circle-box{
+			font-size: 53rpx;margin: 10rpx auto 0;
+			.word-link-box{padding: 9rpx 31rpx 23rpx;}
+			.word-link-box::before,.word-link-box::after{height: 27rpx;}
+			text:not(:first-child)::before{width: 6rpx;height: 6rpx;margin: 0 4rpx;}
+		}
+		.details-title{padding: 5rpx 8rpx;font-size: 16rpx;}
+		.details-content-box{padding: 10rpx;font-size: 18rpx;margin-bottom: 10rpx;}
+		.syky-content{margin: 10rpx 0 23rpx;}
+		.syky-content:last-child{margin: 10rpx 0;}
+		.details-en-content{margin: 10rpx 8rpx;}
+		.details-cn-content{margin: 10rpx 8rpx 16rpx;}
+		&::before,&::after{width: 19rpx;height: 27rpx;}
+		&::before{left: 39rpx;}
+		&::after{right: 39rpx;}
+	}
 	
-		@include mediaBig() {
-			.word-view-border{margin: 51rpx 38rpx 38rpx;border-radius: 26rpx;}
-			.select-words-box{
-				height: 106rpx;font-size: 46rpx;
-				.words-item{padding: 26rpx 16rpx;}
-			}
-			.select-types-box{
-				margin-top: 38rpx;padding: 0 38rpx;
-				.types-item{width: 128rpx;height: 128rpx;line-height: 128rpx;}
-				.jt-item{width: 38rpx;height: 38rpx;}
-			}
-			.word-view-bottom{
-				height: 192rpx;border-top: 13rpx solid #a2c6ff;padding: 0 38rpx;font-size: 45rpx;
-				.collect-btn{
-					icon{width: 67rpx;height: 67rpx;margin-bottom: 10rpx;}
-				}
-				.bottom-btn-box{
-					.word-view-btn{width: 326rpx;height: 123rpx;line-height: 123rpx;}
-					.word-view-btn + .word-view-btn{margin-left: 48rpx;}
-				}
+	@include mediaBig() {
+		.word-view-border{margin: 51rpx 38rpx 38rpx;border-radius: 26rpx;}
+		.select-words-box{
+			height: 106rpx;font-size: 46rpx;
+			.words-item{padding: 26rpx 16rpx;}
+		}
+		.select-types-box{
+			margin-top: 38rpx;padding: 0 38rpx;
+			.types-item{width: 128rpx;height: 128rpx;line-height: 128rpx;font-size: 54rpx;}
+			.jt-item{width: 38rpx;height: 38rpx;margin: 0 48rpx;}
+		}
+		.word-view-bottom{
+			height: 192rpx;border-top: 13rpx solid #a2c6ff;padding: 0 38rpx;font-size: 46rpx;
+			.collect-btn{
+				icon{width: 67rpx;height: 67rpx;margin-bottom: 10rpx;}
 			}
-			.pin-words-explain-box{
-				margin-top: 102rpx;
-				.words-explain-item{font-size: 54rpx;padding: 0 26rpx;}
-				.words-explain-item + .words-explain-item{margin-top: 19rpx;}
-			}
-			.audio-play-btn,.audio-playing-btn{width: 176rpx;height: 176rpx;margin: 90rpx auto 0;}
-			.pin-tip{width: 896rpx;margin: 38rpx auto 0;font-size: 42rpx;padding: 16rpx 0;}
-			.clean-btn{width: 274rpx;height: 93rpx;margin: 38rpx auto 0;}
-			.yb-play-box{
-				margin: 51rpx auto 0;padding: 6rpx 38rpx 16rpx;border-radius: 48rpx;
-				text{font-size: 54rpx;}
-				text:nth-child(even){margin: 0 16rpx;}
-				icon{width: 48rpx;height: 48rpx;margin-left: 38rpx;}
-			}
-			.word-circle-box{
-				font-size: 131rpx;
-				margin: 67rpx auto 0;
-				.word-link-box{padding: 22rpx 77rpx 58rpx;}
-				.word-link-box::before,.word-link-box::after{height: 67rpx;}
-				text:not(:first-child)::before{width: 16rpx;height: 16rpx;margin: 0 10rpx;}
-			}
-			.details-title{padding: 13rpx 19rpx;font-size: 38rpx;}
-			.details-content-box{padding: 26rpx;font-size: 42rpx;margin-bottom: 26rpx;}
-			.syky-content{margin: 26rpx 0 58rpx;}
-			.syky-content:last-child{margin: 26rpx 0;}
-			.details-en-content{margin: 26rpx 19rpx;}
-			.details-cn-content{margin: 26rpx 19rpx 38rpx;}
-		}
-	}
-.word-view-page::before,.word-view-page::after{
-	content: '';width: 29rpx;height: 42rpx;z-index: 5;
-	background-image: url("@/static/images/common/wordView/jt-icon.png");
-	@include ezy-no-repeat-cover;display: block;
-	position: absolute;top: 46%;}
-.word-view-page::before{left: 60rpx;}
-.word-view-page::after{right: 60rpx;transform: rotate(180deg);}
+			.bottom-btn-box{
+				.word-view-btn{width: 326rpx;height: 123rpx;line-height: 123rpx;}
+				.word-view-btn + .word-view-btn{margin-left: 48rpx;}
+			}
+		}
+		.pin-words-explain-box{
+			margin-top: 102rpx;
+			.words-explain-item{font-size: 54rpx;padding: 0 26rpx;}
+			.words-explain-item + .words-explain-item{margin-top: 19rpx;}
+		}
+		.audio-play-btn,.audio-playing-btn{width: 176rpx;height: 176rpx;margin: 90rpx auto 0;}
+		.pin-tip{width: 965rpx;margin: 46rpx auto 0;font-size: 46rpx;padding: 16rpx 0;}
+		.clean-btn{width: 274rpx;height: 93rpx;margin: 38rpx auto 0;}
+		.yb-play-box{
+			margin: 51rpx auto 0;padding: 6rpx 38rpx 16rpx;border-radius: 48rpx;
+			text{font-size: 54rpx;}
+			text:nth-child(even){margin: 0 16rpx;}
+			icon{width: 48rpx;height: 48rpx;margin-left: 38rpx;}
+		}
+		.word-circle-box{
+			font-size: 131rpx;margin: 10rpx auto 0;
+			.word-link-box{padding: 22rpx 77rpx 58rpx;}
+			.word-link-box::before,.word-link-box::after{height: 67rpx;}
+			text:not(:first-child)::before{width: 16rpx;height: 16rpx;margin: 0 10rpx;}
+		}
+		.details-title{padding: 13rpx 19rpx;font-size: 38rpx;}
+		.details-content-box{padding: 26rpx;font-size: 46rpx;margin-bottom: 26rpx;}
+		.syky-content{margin: 26rpx 0 58rpx;}
+		.syky-content:last-child{margin: 26rpx 0;}
+		.details-en-content{margin: 26rpx 19rpx;}
+		.details-cn-content{margin: 26rpx 19rpx 38rpx;}
+		&::before,&::after{width: 46rpx;height: 67rpx;}
+		&::before{left: 96rpx;}
+		&::after{right: 96rpx;}
+	}
+}
 
 // 单词详情- 学
 .words-xue-box{
@@ -2711,20 +2719,106 @@
 	.xue-change-btn-box{
 		display: flex;justify-content: center;border-bottom: 1rpx dashed #8dcff1;padding: 32rpx 0 42rpx;
 		.change-btn{
-			width: 254rpx;height:77rpx;position: relative;line-height: 75rpx;
-			text{color: #3d7efe;position: relative;font-size: 32rpx;z-index: 2;display: inline-block;}
+			width: 254rpx;height:77rpx;position: relative;line-height: 77rpx;font-size: 0;
+			text{color: #3d7efe;position: relative;font-size: 32rpx;z-index: 2;display: inline-block;vertical-align: middle;}
 		}
 		.change-btn::after{
 			content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;@include ezy-no-repeat-cover;
 			background-image: url("@/static/images/common/wordView/change-btn.png");z-index: 1;
 		}
-		.change-btn.active text{color: #fff;}
-		.change-btn.active::after{background-image: url("@/static/images/common/wordView/change-btn-a.png");transform: rotate(180deg);}
+		.change-play-icon{
+			width: 30rpx;height:30rpx;@include ezy-no-repeat-cover;margin-left: 16rpx;
+			display: inline-block;vertical-align: middle;z-index: 2;position: relative;
+			background-image: url("@/static/images/common/wordView/yb-playing-btn.gif");
+		}
+		.change-btn.active{
+			text{color: #fff;}
+			.change-play-icon{background-image: url("@/static/images/common/wordView/yb-white-playing-btn.gif");}
+			&::after{background-image: url("@/static/images/common/wordView/change-btn-a.png");transform: rotate(180deg);}
+			&:last-child::after{transform: unset;}
+		} 
 		.change-btn:last-child::after{transform: rotate(180deg);}
-		.change-btn.active:last-child::after{transform: unset;}
+		
 	}
 
 	.xue-details-content-box{text-align: left;margin-top: 16rpx;}
+	
+	@include mediaSmall() {
+			.words-xue-body{height: calc(100vh - 280rpx - var(--status-bar-height));}
+			.word-block-box{
+				margin-top: 10rpx;
+				text{
+					min-width: 33rpx;height: 33rpx;line-height: 31rpx;
+					font-size: 18rpx;margin: 8rpx 0;padding: 0 6rpx;border-radius: 5rpx;}
+				text + text{margin-left: 6rpx;}
+			}
+			.details-btn{margin: 16rpx auto;padding: 6rpx 16rpx;border-radius: 20rpx;font-size: 18rpx;}
+			.xue-yb-play-box{margin-top: 8rpx;}
+			.xue-words-explain-box{margin-top: 21rpx;}
+			.yb-block-box text{min-width: 36rpx;height: 36rpx;line-height: 35rpx;font-size: 18rpx;}
+			.yj-block-box{
+				min-width: 33rpx;font-size: 18rpx;
+				.yj-block-item + .yj-block-item{margin-left: 6rpx;}
+				.item-top,.item-bottom{height: 34rpx;line-height: 33rpx;padding: 0 6rpx;}
+			}
+			.cg-item-list{
+				.uni-scroll-view-content{padding: 0 16rpx;}
+				.cg-item-box{font-size: 22rpx;padding: 16rpx 0;}
+				.cg-item{
+					min-height: 81rpx;border-radius: 5rpx;padding: 10rpx;
+					view + view{margin-top: 1rpx;}
+				}
+				.cg-symbol{margin: 0 6rpx;}
+			}
+			.xue-change-btn-box{
+				border-bottom: 1rpx dashed #8dcff1;padding: 21rpx 0 27rpx;
+				.change-btn{
+					width: 165rpx;height: 50rpx;line-height: 50rpx;
+					text{font-size: 22rpx;}
+					.change-play-icon{width: 20rpx;height: 20rpx;margin-left: 10rpx;}
+				}
+			}
+			.xue-details-content-box{margin-top: 10rpx;}
+		}
+	
+		@include mediaBig() {
+			.words-xue-body{height: calc(100vh - 750rpx - var(--status-bar-height));}
+			.word-block-box{
+				margin-top: 24rpx;
+				text{
+					min-width: 80rpx;height: 80rpx;line-height: 77rpx;font-size: 46rpx;
+					margin: 19rpx 0;padding: 0 16rpx;border-radius: 13rpx;
+				}
+				text + text{margin-left: 16rpx;}
+			}
+			.details-btn{margin: 38rpx auto;padding: 16rpx 38rpx;border-radius: 48rpx;font-size: 46rpx;}
+			.xue-yb-play-box{margin-top: 19rpx;}
+			.xue-words-explain-box{margin-top: 51rpx;}
+			.yb-block-box text{min-width: 90rpx;height: 90rpx;line-height: 86rpx;font-size: 46rpx;}
+			.yj-block-box{
+				min-width: 80rpx;font-size: 46rpx;
+				.yj-block-item + .yj-block-item{margin-left: 16rpx;}
+				.item-top,.item-bottom{height: 83rpx;line-height: 80rpx;padding: 0 16rpx;}
+			}
+			.cg-item-list{
+				.uni-scroll-view-content{padding: 0 38rpx;}
+				.cg-item-box{font-size: 54rpx;padding: 38rpx 0;}
+				.cg-item{
+					min-height: 198rpx;border-radius: 13rpx;padding: 26rpx;
+					view + view{margin-top: 3rpx;}
+				}
+				.cg-symbol{margin: 0 16rpx;}
+			}
+			.xue-change-btn-box{
+				border-bottom: 1rpx dashed #8dcff1;padding: 51rpx 0 67rpx;
+				.change-btn{
+					width: 406rpx;height: 123rpx;line-height: 120rpx;
+					text{font-size: 54rpx;}
+					.change-play-icon{width: 48rpx;height: 48rpx;margin-left: 24rpx;}
+				}
+			}
+			.xue-details-content-box{margin-top: 26rpx;}
+		}
 }
 
 // 单词详情-拼
@@ -2781,6 +2875,54 @@
 			.audio-play-btn,.audio-playing-btn{width: 96rpx;height:96rpx;margin-top: 24rpx;}
 		}
 	}
+	
+	@include mediaSmall() {
+			height: calc(100vh - 300rpx - var(--status-bar-height));
+			.pin-words-box{
+				margin-top: 42rpx;
+				.words-item{min-width: 59rpx;height: 78rpx;line-height: 78rpx;font-size: 52rpx;padding: 0 4rpx;border-radius: 5rpx;}
+				.words-item + .words-item{margin-left: 8rpx;}
+			}
+			.pin-small-words-box{
+				.words-item{min-width: 46rpx;height: 65rpx;line-height: 72rpx;font-size: 42rpx;padding: 0 3rpx;}
+				.words-item + .words-item{margin-left: 5rpx;}
+			}
+			.pin-error-words-box,.pin-right-words-box{
+				.words-item:last-child::after{width: 30rpx;height: 30rpx;top: -14rpx;right: -8rpx;}
+			}
+			.pin-words-change-box{
+				margin-bottom: 21rpx;
+				.words-change-item{line-height: 75rpx;border-bottom: 5rpx solid #a4e6fc;}
+				.words-change-item.disabled{border-bottom: 5rpx solid #ccc;}
+			}
+			.pin-words-change-box.pin-small-words-box{
+				.words-item{line-height: 59rpx;}
+			}
+		}
+	
+		@include mediaBig() {
+			height: calc(100vh - 736rpx - var(--status-bar-height));
+			.pin-words-box{
+				margin-top: 102rpx;
+				.words-item{min-width: 144rpx;height: 192rpx;line-height: 192rpx;font-size: 128rpx;padding: 0 10rpx;border-radius: 13rpx;}
+				.words-item + .words-item{margin-left: 19rpx;}
+			}
+			.pin-small-words-box{
+				.words-item{min-width: 112rpx;height: 160rpx;line-height: 176rpx;font-size: 102rpx;padding: 0 6rpx;}
+				.words-item + .words-item{margin-left: 13rpx;}
+			}
+			.pin-error-words-box,.pin-right-words-box{
+				.words-item:last-child::after{width: 74rpx;height: 74rpx;top: -35rpx;right: -19rpx;}
+			}
+			.pin-words-change-box{
+				margin-bottom: 51rpx;
+				.words-change-item{line-height: 186rpx;border-bottom: 13rpx solid #a4e6fc;}
+				.words-change-item.disabled{border-bottom: 13rpx solid #ccc;}
+			}
+			.pin-words-change-box.pin-small-words-box{
+				.words-item{line-height: 144rpx;}
+			}
+		}
 }
 
 // 单词详情-读
@@ -2809,6 +2951,35 @@
 		.play-btn{background-image: url("@/static/images/common/wordView/play-btn.png");}
 		.playing-btn{background-image: url("@/static/images/common/wordView/playing-btn.gif");}
 	}
+	@include mediaSmall() {
+			height: calc(100vh - 280rpx - var(--status-bar-height));
+			.du-yb-play-box{margin: 36rpx 0 27rpx;}
+			.du-words-explain-box{margin-top: 16rpx;}
+			.mike-play-box{
+				.mike-play-tip{font-size: 18rpx;}
+				.mike-btn,.mike-az-btn{
+					width: 85rpx;height:85rpx;margin: 10rpx auto 21rpx;
+				}
+				.play-btn,.playing-btn{
+					width: 62rpx;height:62rpx;left: 52rpx;bottom: 10rpx;
+				}
+			}
+		}
+	
+		@include mediaBig() {
+			height: calc(100vh - 736rpx - var(--status-bar-height));
+			.du-yb-play-box{margin: 90rpx 0 67rpx;}
+			.du-words-explain-box{margin-top: 38rpx;}
+			.mike-play-box{
+				.mike-play-tip{font-size: 46rpx;}
+				.mike-btn,.mike-az-btn{
+					width: 208rpx;height:208rpx;margin: 26rpx auto 51rpx;
+				}
+				.play-btn,.playing-btn{
+					width: 154rpx;height:154rpx;left: 128rpx;bottom: 24rpx;
+				}
+			}
+		}
 }
 
 // 单词详情-选
@@ -2844,6 +3015,30 @@
 		.show-words-box{margin: 12rpx auto 0;}
 		.yb-play-box{margin: 12rpx auto 0;}
 	}
+	
+	@include mediaSmall() {
+			height: calc(100vh - 300rpx - var(--status-bar-height));
+			.show-words-box{font-size: 53rpx;margin: 10rpx auto 0;}
+			.select-change-box{
+				.select-item{
+					width: 600rpx;height: 62rpx;border-radius: 8rpx;font-size: 22rpx;
+					border: 2rpx solid #eef1f6;border-bottom: 4rpx solid #eef1f6;margin: 16rpx auto;padding: 0 6rpx;
+				}
+				.select-error::after,.select-right::after{width: 23rpx;height: 23rpx;top: -6rpx;right: -8rpx;}
+			}
+		}
+	
+		@include mediaBig() {
+			height: calc(100vh - 760rpx - var(--status-bar-height));
+			.show-words-box{font-size: 131rpx;margin: 10rpx auto 0;}
+			.select-change-box{
+				.select-item{
+					width: 1600rpx;height: 154rpx;border-radius: 19rpx;font-size: 54rpx;padding: 0 16rpx;
+					border: 4rpx solid #eef1f6;border-bottom: 10rpx solid #eef1f6;margin: 19rpx auto;
+				}
+				.select-error::after,.select-right::after{width: 58rpx;height: 58rpx;top: -16rpx;right: -19rpx;}
+			}
+		}
 
 }
 
@@ -2894,11 +3089,13 @@
 			width: 100%;height: 77rpx;line-height: 77rpx;
 			padding: 0 32rpx;display: flex;margin: 16rpx auto 0;
 		}
-		.big-btn{width: 120rpx;background-color: #fff;border-bottom:6rpx solid #e2e2e2;color:#000;margin-right: 6px;border-radius: 8rpx;}
+		.big-btn{width: 120rpx;height: 78rpx;line-height: 78rpx;background-color: #fff;border-bottom:6rpx solid #e2e2e2;
+		color:#000;margin-right: 6px;border-radius: 8rpx;font-size: 30rpx;box-sizing: border-box;}
 		.big-btn.active{color: #2c9cfe;font-weight: bolder;}
 		.bei-confirm-btn{
+			height: 78rpx;line-height: 78rpx;
 			background-color: transparent;color: #fff;border-radius: 8rpx;flex: 1;
-			background-color: #2c9cfe;border-bottom:6rpx solid #0285fb;
+			background-color: #2c9cfe;border-bottom:6rpx solid #0285fb;font-size: 30rpx;
 		}
 	}
 	@media (max-height: 800px) {
@@ -2922,20 +3119,84 @@
 		.clean-btn{margin-top: 24rpx;}
 		.words-answer-error-box::after,.words-answer-right-box::after{width: 36rpx;height: 36rpx;top: -6rpx;right: -6rpx;}
 	}
+	
+	@include mediaSmall() {
+			height: calc(100vh - 270rpx - var(--status-bar-height));
+			.words-answer-box{
+				min-width: 273rpx;height: 78rpx;line-height: 78rpx;margin: 16rpx auto 0;
+				font-size: 46rpx;border-radius: 5rpx;padding: 0 6rpx;
+				.uni-input-placeholder.input-placeholder{font-size: 42rpx;}
+			}
+			.words-answer-box::placeholder { font-size: 42rpx; }
+			.words-answer-error-box::after,.words-answer-right-box::after{width: 30rpx;height: 30rpx;top: -14rpx;right: -8rpx;}
+			.bei-body-box{margin-bottom: 282rpx;}
+			.words-keyboard-box{
+				padding: 16rpx 0;
+				.keyboard-row{padding: 0 21rpx;margin-bottom: 8rpx;}
+				.keyboard-button{
+					width: 70rpx;height: 58rpx;line-height: 58rpx;
+					font-size: 22rpx;border-radius: 4rpx;border-bottom: 4rpx solid #e2e2e2;
+				}
+				.keyboard-button.active{border-bottom: 4rpx solid #a4e6fc;}
+				.del-btn::after{width: 30rpx;height: 30rpx;margin: 14rpx auto;}
+				.bei-confirm-btn-box{height: 50rpx;line-height: 50rpx;padding: 0 21rpx;margin: 10rpx auto 0;}
+				.big-btn{width: 146rpx;height: 58rpx;line-height: 58rpx;border-radius: 5rpx;margin-right: 6px;font-size: 20rpx;}
+				.bei-confirm-btn{height: 58rpx;line-height: 58rpx;border-radius: 5rpx;font-size: 20rpx;}
+			}
+		}
+		
+	@include mediaBig() {
+		height: calc(100vh - 624rpx - var(--status-bar-height));
+		.words-answer-box{
+			min-width: 672rpx;height: 192rpx;line-height: 192rpx;margin: 64rpx auto 0;
+			font-size: 115rpx;border-radius: 13rpx;padding: 0 16rpx;
+			.uni-input-placeholder.input-placeholder{font-size: 102rpx;}
+		}
+		.words-answer-box::placeholder { font-size: 102rpx; }
+		.words-answer-error-box::after,.words-answer-right-box::after{width: 74rpx;height: 74rpx;top: -35rpx;right: -19rpx;}
+		.bei-body-box{margin-bottom: 694rpx;}
+		.words-keyboard-box{
+			padding: 38rpx 0;
+			.keyboard-row{padding: 0 51rpx;margin-bottom: 19rpx;}
+			.keyboard-button{
+				width: 190rpx;height: 144rpx;line-height: 144rpx;
+				font-size: 54rpx;border-radius: 10rpx;border-bottom: 10rpx solid #e2e2e2;
+			}
+			.keyboard-button.active{border-bottom: 10rpx solid #a4e6fc;}
+			.del-btn::after{width: 74rpx;height: 74rpx;margin: 35rpx auto;}
+			.bei-confirm-btn-box{height: 123rpx;line-height: 123rpx;padding: 0 51rpx;margin: 26rpx auto 0;}
+			.big-btn{
+				width: 400rpx;height: 125rpx;line-height: 125rpx;
+				border-radius: 13rpx;margin-right: 10px;font-size: 46rpx;
+			}
+			.bei-confirm-btn{height: 125rpx;line-height: 125rpx;border-radius: 13rpx;font-size: 46rpx;}
+		}
+	}
+	
+
 }
 
 // 单词详解
 .words-details-page{
-	// background-image: url("@/static/images/course/course-cjdc-bj.png");
 	.words-details-body{overflow-y: auto;padding: 0;}
 	.details-word{color: #000;font-size: 62rpx;font-weight: bold;margin:6rpx 0 24rpx;}
 	.tysy-content{color: #333;margin: 16rpx 12rpx 0;}
+	@include mediaSmall() {
+		.details-word{font-size: 40rpx;margin: 4rpx 0 16rpx;}
+		.tysy-content{margin: 10rpx 8rpx 0;}
+	}
+	@include mediaBig() {
+		.details-word{font-size: 100rpx;margin: 10rpx 0 38rpx;}
+		.tysy-content{margin: 26rpx 19rpx 0;}
+	}
 }
 
 // 对错弹窗
 .ezy-image-dialog{
 	width: 500rpx;height: 440rpx;background-position: center;
 	background-size: cover;background-repeat: no-repeat;
+	@include mediaSmall() {width: 325rpx;height: 286rpx;}
+	@include mediaBig() {width: 800rpx;height: 704rpx;}
 }
 .ezy-image-dialog.wrong{background-image: url("@/static/images/common/wordView/error-tip-img.gif");}
 .ezy-image-dialog.right{background-image: url("@/static/images/common/wordView/right-tip-img.gif");}

+ 2 - 2
pages/chanpinneirong/chanpin1.vue

@@ -10,9 +10,9 @@
 						<img :src="banbenInfo.cover" />
 						<view class="body-right">
 							<view class="right-name">{{ banbenInfo.chanpinName }}</view>
-							<view class="right-item right-item-mini">等级:{{banbenInfo.dengjiName}}</view>
+							<view class="right-item">等级:{{banbenInfo.dengjiName}}</view>
 							<view class="right-item">版本:{{banbenInfo.name}}</view>
-							<view class="right-item right-item-mini">单元:{{banbenInfo.curDanyuanName}}</view>
+							<view class="right-item">单元:{{banbenInfo.curDanyuanName}}</view>
 							<view class="right-item">课程:{{banbenInfo.curKechengName}}</view>
 						</view>
 					</view>

+ 2 - 2
pages/chanpinneirong/chanpin2.vue

@@ -10,9 +10,9 @@
 						<img :src="neirongInfo.cover" />
 						<view class="body-right">
 							<view class="right-name">{{ neirongInfo.chanpinName }}</view>
-							<view class="right-item right-item-mini">等级:{{neirongInfo.dengjiName}}</view>
+							<view class="right-item">等级:{{neirongInfo.dengjiName}}</view>
 							<view class="right-item">版本:{{neirongInfo.name}}</view>
-							<view>课程:{{neirongInfo.curKechengName}}</view>
+							<view class="right-item-all">课程:{{neirongInfo.curKechengName}}</view>
 						</view>
 					</view>
 					<view class="card-progress-box">

+ 2 - 2
pages/chanpinneirong/chanpin3.vue

@@ -10,9 +10,9 @@
 						<img :src="neirongInfo.cover" />
 						<view class="body-right">
 							<view class="right-name">{{ neirongInfo.chanpinName }}</view>
-							<view class="right-item right-item-mini">等级:{{neirongInfo.dengjiName}}</view>
+							<view class="right-item">等级:{{neirongInfo.dengjiName}}</view>
 							<view class="right-item">版本:{{neirongInfo.name}}</view>
-							<view>课程:{{neirongInfo.curDanyuanName}}</view>
+							<view class="right-item-all">课程:{{neirongInfo.curDanyuanName}}</view>
 						</view>
 					</view>
 					<view class="card-progress-box">

+ 2 - 2
pages/chanpinneirong/chanpin4.vue

@@ -10,9 +10,9 @@
 						<img :src="banbenInfo.cover" />
 						<view class="body-right">
 							<view class="right-name">{{ banbenInfo.chanpinName }}</view>
-							<view class="right-item right-item-mini">等级:{{banbenInfo.dengjiName}}</view>
+							<view class="right-item">等级:{{banbenInfo.dengjiName}}</view>
 							<view class="right-item">版本:{{banbenInfo.name}}</view>
-							<view class="right-item right-item-mini">单元:{{banbenInfo.curDanyuanName}}</view>
+							<view class="right-item">单元:{{banbenInfo.curDanyuanName}}</view>
 							<view class="right-item">课程:{{banbenInfo.curKechengName}}</view>
 						</view>
 					</view>

+ 4 - 4
pages/chaojidanci/newEnglish/components/xuePage.vue

@@ -41,12 +41,12 @@
 					<!-- 音标按钮 -->
 					<view class="xue-change-btn-box">
 						<ezyActiveVue class="ezy-btn-active change-btn" :class="{active: data.isPindu}" @click="handlePindu">
-              <text v-if="data.isPindu && isAutoPlaying">播放中</text>
-              <text>自然拼读</text>
+						  <text>自然拼读</text>
+						  <icon v-if="data.isPindu && isAutoPlaying" class="change-play-icon" ></icon>
 						</ezyActiveVue>
 						<ezyActiveVue class="ezy-btn-active change-btn" :class="{active: !data.isPindu}" @click="handleYinjie">
-              <text v-if="!data.isPindu && isAutoPlaying">播放中</text>
-              <text>音节拆分</text>
+						  <text>音节拆分</text>
+						  <icon v-if="!data.isPindu && isAutoPlaying" class="change-play-icon" ></icon>
 						</ezyActiveVue>
 					</view>
 					<!-- 词根+实用口语 -->

二进制
static/images/common/wordView/yb-white-playing-btn.gif


二进制
static/images/pad/wordView/exam-tip-bj.png