From f15a0dd0e6a82246fdab9edddd0f48805e10aeaf Mon Sep 17 00:00:00 2001
From: ZLY <zhongliangyuan@gdngsk.com>
Date: Tue, 19 Aug 2025 11:02:22 +0800
Subject: [PATCH] =?UTF-8?q?feat(components):=20=E6=96=B0=E5=A2=9E=20Custom?=
 =?UTF-8?q?Card=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/CustomCard/index.tsx           | 25 +++++++++++++++++++
 .../CustomCard/style/index.module.less        |  7 ++++++
 2 files changed, 32 insertions(+)
 create mode 100644 src/components/CustomCard/index.tsx
 create mode 100644 src/components/CustomCard/style/index.module.less

diff --git a/src/components/CustomCard/index.tsx b/src/components/CustomCard/index.tsx
new file mode 100644
index 0000000..bd0c1ea
--- /dev/null
+++ b/src/components/CustomCard/index.tsx
@@ -0,0 +1,25 @@
+import React from 'react';
+import { Card } from '@arco-design/web-react';
+import style from './style/index.module.less';
+
+interface CustomCardProps {
+  children: React.ReactNode;
+  hoverable?: boolean;
+  className?: string;
+
+  [key: string]: any; // 其余可支持属性参考文档：https://arco.design/react/components/card
+}
+
+const CustomCard: React.FC<CustomCardProps> = ({ children, hoverable = true, className = '', ...restProps }) => {
+  return (
+    <Card
+      className={`${style['card-custom-hover-style']} ${className}`}
+      hoverable={hoverable}
+      {...restProps}
+    >
+      {children}
+    </Card>
+  );
+};
+
+export default CustomCard;
diff --git a/src/components/CustomCard/style/index.module.less b/src/components/CustomCard/style/index.module.less
new file mode 100644
index 0000000..337c0e2
--- /dev/null
+++ b/src/components/CustomCard/style/index.module.less
@@ -0,0 +1,7 @@
+.card-custom-hover-style {
+  transition-property: all;
+}
+
+.card-custom-hover-style:hover {
+  transform: translateY(-4px);
+}
\ No newline at end of file