From 7138b40f74adaf47960d8be73427eb92f61e0090 Mon Sep 17 00:00:00 2001
From: saller <weskerli@163.com>
Date: Tue, 4 Jul 2023 19:56:24 +0800
Subject: [PATCH] fix(comp:carousel): dot clickable area is too small (#1590)

---
 packages/components/carousel/style/index.less | 23 +++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

diff --git a/packages/components/carousel/style/index.less b/packages/components/carousel/style/index.less
index 3c0db0b48..87586e717 100644
--- a/packages/components/carousel/style/index.less
+++ b/packages/components/carousel/style/index.less
@@ -66,7 +66,6 @@
     }
   }
 
-
   &-vertical &-slider {
     height: auto;
   }
@@ -114,11 +113,24 @@
   }
 
   &-dot {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
     opacity: @carousel-icon-opacity;
     cursor: pointer;
-    line-height: @carousel-dot-vertical-width;
     font-size: 0; // 消除幽灵高度，避免影响间距计算
 
+    &::after {
+      position: absolute;
+      top: ~'calc(-1 * min(max(200%, 16px), 32px) / 2 + 100% / 2)';
+      left: 0;
+      display: block;
+      content: ' ';
+      width: 100%;
+      height: ~'min(max(200%, 16px), 32px)';
+    }
+
     &:hover,
     &-active {
       opacity: @carousel-icon-active-opacity;
@@ -152,6 +164,13 @@
       width: @carousel-dot-vertical-width;
       height: @carousel-dot-vertical-height;
     }
+
+    &::after {
+      top: 0;
+      left: ~'calc(-1 * min(max(200%, 16px), 32px) / 2 + 100% / 2)';
+      width: ~'min(max(200%, 16px), 32px)';
+      height: 100%;
+    }
   }
 
   &-horizontal &-dot + &-dot {