完善移动端适配

src/pages/events/swiper.vue

@@ -8,6 +8,7 @@ const props = defineProps({
 		default: () => [],
 	},
 })
+const emit = defineEmits(['clickItem'])
 //const emit = defineEmits([
 //])
 
@@ -37,10 +38,10 @@ defineExpose({})
 						<div class="info">
 							{{ item?.brief }}		
 						</div>
-						<a href="#" class="read-more" target="_blank">
+						<div class="read-more" @click="$emit('clickItem', item)">
 							Read More
 							<span class="iconfont icon-direction-right"></span>
-						</a>
+						</div>
 					</div>
 				</div>
 				
@@ -66,6 +67,11 @@ defineExpose({})
 			margin: 0 auto;
 			max-width: 1120px;
 			position: relative;
+			@media (max-width: 1000px) {
+				max-width: 767px;
+				padding: 10px;
+				padding-top: 30px;
+			}
 			> .events-carousel{
 				.carousel-item{
 					overflow: hidden;
@@ -80,6 +86,9 @@ defineExpose({})
 						height: 600px;
 						width: 100%;
 						overflow: hidden;
+						@media (max-width: 1000px) {
+							height: 500px;
+						}
 						img{
 							width: 100%;							
 							height: 100%;
@@ -95,6 +104,9 @@ defineExpose({})
 						background-color: #fff;
 						position: relative;
 						z-index: 22;
+						@media (max-width: 1000px) {
+							width: calc(100% - 50px);
+						}
 						.title{
 							font-family: Poppins, sans-serif;
 							font-weight: 600;
@@ -121,6 +133,8 @@ defineExpose({})
 							font-size: 14px;
 							text-decoration: none;
 							position: relative;
+							width: min-content;
+							white-space: nowrap;
 							&:hover{
 								&::after{
 									left: 0;
@@ -158,8 +172,16 @@ defineExpose({})
 				justify-content: center;
 				position: absolute;
 				bottom: 0;
+				z-index: 2222;
+				@media (max-width: 1000px) {
+					width: 40px;
+					height: 40px;
+				}
 				> span{
 					font-size: 38px;
+					@media (max-width: 1000px) {
+						font-size: 24px;
+					}
 				}
 				&:hover{
 					border: 1px solid #000;
@@ -167,6 +189,9 @@ defineExpose({})
 			}
 			.prev-page{
 				right: 112px;
+				@media (max-width: 1000px) {
+					right: 50px;
+				}
 			}
 			.next-page{
 				right: 0;