From 47eb83a3543554e6651ba07ce5ed7aaa19bad314 Mon Sep 17 00:00:00 2001
From: xifanTT <514329552@qq.com>
Date: Mon, 16 Dec 2024 14:25:38 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20mobile-react=E5=90=8C=E6=AD=A5swiper?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 style/mobile/components/swiper/v2/_index.less | 54 +++++++++++++++++++
 style/mobile/components/swiper/v2/_var.less   |  2 +
 2 files changed, 56 insertions(+)

diff --git a/style/mobile/components/swiper/v2/_index.less b/style/mobile/components/swiper/v2/_index.less
index ee4a67a20b..f49d26e417 100644
--- a/style/mobile/components/swiper/v2/_index.less
+++ b/style/mobile/components/swiper/v2/_index.less
@@ -20,6 +20,28 @@
     & > * {
       border-radius: @swiper-border-radius;
     }
+
+    &--image-host {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      overflow: hidden;
+      justify-content: center;
+      position: relative;
+
+      & > * {
+        border-radius: @swiper-border-radius;
+      }
+
+      img {
+        height: 100%;
+        width: 100%;
+        max-width: none;
+        object-fit: cover;
+      }
+    }
   }
 
   // 主要容器
@@ -41,4 +63,36 @@
   &--outside {
     padding-bottom: @swiper-placement-outside-padding;
   }
+
+  &__container--card {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    top: 0;
+  }
+
+  &--card {
+    .@{prefix}-swiper-item {
+      display: flex;
+      align-items: center;
+      box-sizing: border-box;
+      z-index: 0;
+      &--active{
+        z-index: 1;
+      }
+    }
+
+    .t-swiper-item--image-host {
+      transition: all 0.3s ease;
+    }
+
+    .t-swiper-item--image-host--prev{
+      right: @swiper-item-right-padding;
+    }
+
+    .t-swiper-item--image-host--next{
+      left: @swiper-item-left-padding;
+    }
+  }
 }
diff --git a/style/mobile/components/swiper/v2/_var.less b/style/mobile/components/swiper/v2/_var.less
index d91473fc56..d1762d56cc 100644
--- a/style/mobile/components/swiper/v2/_var.less
+++ b/style/mobile/components/swiper/v2/_var.less
@@ -4,3 +4,5 @@
   --td-swiper-placement-outside-padding,
   calc(@spacer-1 + @swiper-nav-dot-size)
 );
+@swiper-item-left-padding: var(--td-swiper-item-left-padding, 6px);
+@swiper-item-right-padding: var(--td-swiper-item-right-padding, 6px);