瀏覽代碼

Revert "fix: add responsive margins to banner swiper arrows"

This reverts commit 292168a90c2f0cd353feecc605ebecc4a08e53de.
Ryuiso 3 周之前
父節點
當前提交
e633f0320b
共有 1 個文件被更改,包括 5 次插入50 次删除
  1. 5 50
      src/view/HomePage.vue

+ 5 - 50
src/view/HomePage.vue

@@ -190,61 +190,16 @@ export default {
 
 #swiper .banner-swiper {
   width: 100%;
-  height: 500px;
-}
-
-#swiper .banner-swiper .swiper-slide {
-  width: 100%;
-  height: 100%;
+  height: auto;
 }
 
 #swiper .banner-swiper .swiper-slide img {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-}
-
-/* Swiper 导航箭头 */
-#swiper .banner-swiper .swiper-button-prev,
-#swiper .banner-swiper .swiper-button-next {
-  color: #fff;
-  width: 50px;
-  height: 50px;
-  transition: all 0.3s ease;
-}
-
-#swiper .banner-swiper .swiper-button-prev:hover,
-#swiper .banner-swiper .swiper-button-next:hover {
-  color: #1e73be;
-  transform: scale(1.1);
-}
-
-/* 桌面端箭头边距 */
-@media (min-width: 1200px) {
-  #swiper .banner-swiper .swiper-button-prev {
-    left: 40px !important;
-  }
-  #swiper .banner-swiper .swiper-button-next {
-    right: 40px !important;
-  }
-}
-
-/* 平板端箭头边距 */
-@media (min-width: 768px) and (max-width: 1199px) {
-  #swiper .banner-swiper .swiper-button-prev {
-    left: 20px !important;
-  }
-  #swiper .banner-swiper .swiper-button-next {
-    right: 20px !important;
-  }
+  max-width: 100%;
+  background-size: cover;
 }
 
-/* 移动端隐藏箭头 */
-@media (max-width: 767px) {
-  #swiper .banner-swiper .swiper-button-prev,
-  #swiper .banner-swiper .swiper-button-next {
-    display: none;
-  }
+#swiper .banner-swiper .swiper-slide {
+  position: relative;
 }
 
 #swiper .banner-swiper .swiper-slide-title {