Ver código fonte

样式修改

tanxue 4 semanas atrás
pai
commit
bedfe49bf6

+ 17 - 2
common/styles/global/components.scss

@@ -253,12 +253,27 @@ view{box-sizing: border-box;}
 /***** 阅读题 *****/
 .phone-yuedu-box{
 	overflow: auto;height: calc(100vh - 440rpx - var(--status-bar-height));
-	display: flex;flex-direction: column;
+	display: flex;flex-direction: column;position: relative;
 	.yuedu-swiper-box{flex: 1;}
-	.yuedu-swiper-content{overflow-y: auto;background-color: #ccc;padding: 32rpx 52rpx;box-sizing: border-box;}
+	.yuedu-swiper-content{overflow-y: auto;padding: 32rpx 52rpx;box-sizing: border-box;}
 	.phone-danxuan-box,.phone-duoxuan-box,.phone-panduan-box,.phone-tiankong-box,.phone-jianda-box{
 		height: auto;
 	}
+	.yuedu-left-jt,.yuedu-right-jt{
+		width: 27rpx;height: 44rpx;display: block;position: absolute;top: 52%;
+		background-image: url("@/static/images/exam/yuedu-jt-icon.svg");@include ezy-no-repeat-cover();
+	}
+	.yuedu-left-jt{left: 16rpx;transform: rotate(180deg);}
+	.yuedu-right-jt{right: 16rpx;}
+	.yuedu-left-jt.disable,.yuedu-right-jt.disable{opacity: 0.35;}
+	.button-next-tip{
+	  width: 320rpx;position: absolute;bottom:50%;right:0;pointer-events: none;z-index: 2;font-size: 28rpx;line-height: 1.5;
+	  background: #646566;color: #fff;border-radius: 10rpx;margin: 0;padding:24rpx 24rpx;text-align: center;
+	  &::before{
+		  content: '';bottom: -40rpx;display:inline-block; border-width:10px;
+		  border-style:solid dashed dashed; border-color:#646566 transparent transparent ;
+		  font-size:0; line-height:0;right: 12px;position: absolute;}
+	}
 }
 
 /*****音频播放器 author: TX  date:2024-06-24*****/

+ 3 - 3
components/questions/yuedu.vue

@@ -30,9 +30,9 @@
 				</template>
 			</swiper-item>
 		</swiper>
-		<view @click="handleRight" :class="{disable: swiperDotIndex == 0}">shang</view>
-		<view @click="handleLeft" :class="{disable: swiperDotIndex == data.content.length-1}">xia</view>
-		<view v-if="showTishi">提示信息</view>
+		<view  class="yuedu-left-jt" @click="handleRight" :class="{disable: swiperDotIndex == 0}"></view>
+		<view  class="yuedu-right-jt" @click="handleLeft" :class="{disable: swiperDotIndex == data.content.length-1}"></view>
+		<view class="button-next-tip" v-if="showTishi">点击左右蓝色箭头,<br/>跳转阅读题上下小题</view>
 	</view>
 </template>
 

+ 1 - 0
static/images/exam/yuedu-jt-icon.svg

@@ -0,0 +1 @@
+<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'><path d='M27,22L27,22L5,44l-2.1-2.1L22.8,22L2.9,2.1L5,0L27,22L27,22z' fill='#007aff'/></svg>