From 0a81a0077123ebd840384b03db4d5319f8095937 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E7=88=B1=E5=90=83=E7=99=BD=E8=90=9D?=
 =?UTF-8?q?=E5=8D=9C?= <smith3816@gmail.com>
Date: Mon, 15 May 2023 14:54:51 +0800
Subject: [PATCH] fix: Preset color block style (#42361)

* fix: Preset color block style

* chore: use token
---
 components/color-picker/style/color-block.ts | 6 +++---
 components/color-picker/style/picker.ts      | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/components/color-picker/style/color-block.ts b/components/color-picker/style/color-block.ts
index e5b3c1ce8c..24e110d431 100644
--- a/components/color-picker/style/color-block.ts
+++ b/components/color-picker/style/color-block.ts
@@ -6,9 +6,9 @@ const TRANSPARENT_DOT_COLOR = '#EEE';
 /**
  * @private Internal usage only
  */
-export const getTransBg = (size: number): CSSObject => ({
+export const getTransBg = (size: string): CSSObject => ({
   backgroundImage: `conic-gradient(${TRANSPARENT_DOT_COLOR} 0 25%, transparent 0 50%, ${TRANSPARENT_DOT_COLOR} 0 75%, transparent 0)`,
-  backgroundSize: `${size}px ${size}px`,
+  backgroundSize: `${size} ${size}`,
 });
 
 const genColorBlockStyle = (token: ColorPickerToken, size: number): CSSObject => {
@@ -21,7 +21,7 @@ const genColorBlockStyle = (token: ColorPickerToken, size: number): CSSObject =>
       width: size,
       height: size,
       boxShadow: colorPickerInsetShadow,
-      ...getTransBg(size / 2),
+      ...getTransBg('50%'),
       [`${componentCls}-color-block-inner`]: {
         width: '100%',
         height: '100%',
diff --git a/components/color-picker/style/picker.ts b/components/color-picker/style/picker.ts
index fbd393b7a7..7bce67d59f 100644
--- a/components/color-picker/style/picker.ts
+++ b/components/color-picker/style/picker.ts
@@ -58,7 +58,7 @@ const genPickerStyle: GenerateStyle<ColorPickerToken, CSSObject> = (token) => {
         borderRadius: colorPickerSliderHeight / 2,
         boxShadow: colorPickerInsetShadow,
       },
-      '&-alpha': getTransBg(8),
+      '&-alpha': getTransBg(`${colorPickerSliderHeight}px`),
       marginBottom: marginSM,
     },