From e5c2d9dd458a0696797c37ea277cac7741fa8407 Mon Sep 17 00:00:00 2001
From: gin-lsl <gin_lsl@outlook.com>
Date: Fri, 14 Feb 2025 18:38:50 +0800
Subject: [PATCH] =?UTF-8?q?docs:=20=E6=B7=BB=E5=8A=A0=20Material=20Design?=
 =?UTF-8?q?=203=20=E9=A3=8E=E6=A0=BC=E8=87=AA=E5=AE=9A=E4=B9=89=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 docs/guide/demos/tokens.ts            | 41 ++++++++++++++++++++++++++-
 docs/guide/demos/try-it-out/index.tsx |  2 +-
 2 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/docs/guide/demos/tokens.ts b/docs/guide/demos/tokens.ts
index a80641c06..ff1838b56 100644
--- a/docs/guide/demos/tokens.ts
+++ b/docs/guide/demos/tokens.ts
@@ -1,7 +1,15 @@
 import type { Web3ThemeConfig } from '@ant-design/web3';
 import { theme } from 'antd';
 
-export type ThemeValue = 'default' | 'violet' | 'dark' | 'green' | 'pink' | 'retro' | 'win95';
+export type ThemeValue =
+  | 'default'
+  | 'violet'
+  | 'dark'
+  | 'green'
+  | 'pink'
+  | 'retro'
+  | 'win95'
+  | 'material';
 
 export const customToken: Web3ThemeConfig = {
   token: {
@@ -160,6 +168,37 @@ export const themeList: ThemeSetting[] = [
       },
     },
   },
+  {
+    color: '#6750A4',
+    value: 'material',
+    name: 'Material Design 3',
+    buttonType: 'primary',
+    token: {
+      token: {
+        colorPrimary: '#6750a4',
+        colorBorderBg: '',
+        colorLink: '#6750a4',
+        colorBgBase: '#fdfbff',
+        colorBgContainer: '#fdfbff',
+        colorBgMask: 'rgba(0, 0, 0, 0.32)',
+        controlHeight: 40,
+      },
+      components: {
+        Button: {
+          colorBorder: 'transparent',
+          colorText: '#6750a4',
+          colorPrimaryBg: '#6750a4',
+          primaryShadow: 'none',
+          dangerShadow: 'none',
+          defaultShadow: 'none',
+        },
+        Modal: {
+          contentBg: '#fffbfe',
+          boxShadow: 'none',
+        },
+      },
+    },
+  },
   {
     value: 'green',
     name: 'Forest green',
diff --git a/docs/guide/demos/try-it-out/index.tsx b/docs/guide/demos/try-it-out/index.tsx
index f0b06dc7d..89fbc7756 100644
--- a/docs/guide/demos/try-it-out/index.tsx
+++ b/docs/guide/demos/try-it-out/index.tsx
@@ -192,7 +192,7 @@ const App: React.FC = () => {
                   }}
                   defaultValue={defaultRadius}
                   min={0}
-                  max={16}
+                  max={24}
                   onChange={setRadius}
                 />
               </Space>