feat: playground

src/global.less

@@ -1,14 +1,30 @@
 html{
-  --color-fill-1: #f3f6fa;
+  --color-fill-1: rgba(0, 0, 0, 0.04);
   --color-fill-2: #fff;
+  --color-fill-3: #f3f6fa;
   --menu-border-radius-base: 32px;
+  --border-radius-base: 16px;
   --color-white-1: #fff;
   --font-weight-normal: 500;
   --font-weight-bold: 700;
   --color-text-1: #1d2129;
+  --color-bg-light-1: #f0fff6;
+  --font-size-base: 12px;
+  --ant-input-active-shadow: 0 0 0 2px rgba(5, 255, 105, 0.06);
+  --ant-input-active-border-color: #2fbf85;
+  --ant-color-fill-secondary: rgba(0, 0, 0, 0.06);
+  // --color-text-1: #000;
+ 
 
   .css-var-rf {
-    --ant-font-size: 12px;
+    --ant-font-size:  var(--font-size-base);
+  }
+  .css-var-r0 {
+    // --ant-control-height: 36px;
+    --ant-font-size-sm:  var(--font-size-base);
+    --ant-font-size-lg:  var(--font-size-base);
+    --ant-font-size-xl: 20px;
+    --ant-padding-sm: 14px;
   }
  
   .css-var-rf.ant-menu-css-var {
@@ -20,8 +36,17 @@ html{
     --ant-menu-item-color: var(--color-text-1);
     --ant-menu-item-active-bg: var(--color-white-1);
   }
+  .css-var-r0.ant-input-css-var {
+    --ant-input-input-font-size: var(--font-size-base);
+    --ant-input-input-font-size-lg: var(--font-size-base);
+    --ant-input-input-font-size-sm:var(--font-size-base);
+  }
+  .css-var-r0.ant-select-css-var {
+    --ant-select-option-active-bg: var(--color-fill-1);
+    --ant-select-option-font-size: var(--font-size-base);
+  } 
 }
-body {
+body * {
   font-weight: var(--font-weight-normal);
 }
 
@@ -29,6 +54,7 @@ body {
 .ant-pro-layout {
   height: 100vh;
   .ant-pro-sider-logo {
+    padding-left: 22px;
     border-block-end: none;
   }
   .ant-layout {
@@ -58,4 +84,4 @@ body {
 }
 // ======== menu style end ============
 
-@import url('src/assets/menu.less');
+@import url('src/assets/styles/menu.less');