|
@@ -2457,7 +2457,7 @@
|
|
|
margin-top: 24rpx;box-sizing: border-box;padding:0 24rpx;
|
|
margin-top: 24rpx;box-sizing: border-box;padding:0 24rpx;
|
|
|
.types-item{
|
|
.types-item{
|
|
|
width: 80rpx;height: 80rpx;line-height: 80rpx;text-align: center;box-sizing: content-box;
|
|
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;
|
|
.types-item.active{background-color: #659ff1;color: #fff;
|
|
|
border: 1rpx solid #659ff1;box-shadow: 0 0 10rpx rgba(100, 159, 241, 0.9);}
|
|
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;
|
|
.jt-item{width: 24rpx;height: 24rpx;@include ezy-no-repeat-contain;
|
|
@@ -2510,7 +2510,7 @@
|
|
|
// 音标播放
|
|
// 音标播放
|
|
|
.yb-play-box{
|
|
.yb-play-box{
|
|
|
background-color: #dcf7fe;display: inline-block;margin: 32rpx auto 0;
|
|
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{font-size: 34rpx;display: inline-block;vertical-align: middle;}
|
|
|
text:nth-child(even){color: #3c7efd;margin: 0 10rpx;}
|
|
text:nth-child(even){color: #3c7efd;margin: 0 10rpx;}
|
|
|
icon{width: 30rpx;height:30rpx;@include ezy-no-repeat-cover;margin-left: 24rpx;
|
|
icon{width: 30rpx;height:30rpx;@include ezy-no-repeat-cover;margin-left: 24rpx;
|
|
@@ -2557,112 +2557,119 @@
|
|
|
.word-color{color: #3a7fe9;}
|
|
.word-color{color: #3a7fe9;}
|
|
|
.details-cn-content{color: #666;margin: 16rpx 12rpx 24rpx;}
|
|
.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() {
|
|
@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{
|
|
.words-xue-box{
|
|
@@ -2711,7 +2718,7 @@
|
|
|
.xue-change-btn-box{
|
|
.xue-change-btn-box{
|
|
|
display: flex;justify-content: center;border-bottom: 1rpx dashed #8dcff1;padding: 32rpx 0 42rpx;
|
|
display: flex;justify-content: center;border-bottom: 1rpx dashed #8dcff1;padding: 32rpx 0 42rpx;
|
|
|
.change-btn{
|
|
.change-btn{
|
|
|
- width: 254rpx;height:77rpx;position: relative;line-height: 75rpx;
|
|
|
|
|
|
|
+ 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;}
|
|
text{color: #3d7efe;position: relative;font-size: 32rpx;z-index: 2;display: inline-block;}
|
|
|
}
|
|
}
|
|
|
.change-btn::after{
|
|
.change-btn::after{
|
|
@@ -2725,6 +2732,81 @@
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.xue-details-content-box{text-align: left;margin-top: 16rpx;}
|
|
.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;}
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .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;}
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ .xue-details-content-box{margin-top: 26rpx;}
|
|
|
|
|
+ }
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
// 单词详情-拼
|
|
// 单词详情-拼
|
|
@@ -2781,6 +2863,54 @@
|
|
|
.audio-play-btn,.audio-playing-btn{width: 96rpx;height:96rpx;margin-top: 24rpx;}
|
|
.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 +2939,35 @@
|
|
|
.play-btn{background-image: url("@/static/images/common/wordView/play-btn.png");}
|
|
.play-btn{background-image: url("@/static/images/common/wordView/play-btn.png");}
|
|
|
.playing-btn{background-image: url("@/static/images/common/wordView/playing-btn.gif");}
|
|
.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 +3003,30 @@
|
|
|
.show-words-box{margin: 12rpx auto 0;}
|
|
.show-words-box{margin: 12rpx auto 0;}
|
|
|
.yb-play-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: 1rpx 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: 3rpx solid #eef1f6;border-bottom: 10rpx solid #eef1f6;margin: 19rpx auto;
|
|
|
|
|
+ }
|
|
|
|
|
+ .select-error::after,.select-right::after{width: 58rpx;height: 58rpx;top: -16rpx;right: -19rpx;}
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|