@oceanbase/design 1.0.0-alpha.1 → 1.0.0-alpha.2

package/es/badge/style/index.js

@@ -5,15 +5,11 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genBadgeStyle = function genBadgeStyle(token) {
   var componentCls = token.componentCls;
-  // dot size is larger than antd
-  var dotSize = token.fontSizeLG / 2;
   return _defineProperty(_defineProperty({}, "".concat(componentCls), {
-    // inherit color from parent instead of fixed colorText
-    color: 'inherit'
-  }), "".concat(componentCls).concat(componentCls, "-status"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-status-dot"), _defineProperty({
-    width: dotSize,
-    height: dotSize
-  }, "&".concat(componentCls, "-status-default"), {
+    // make status text inherit parent style
+    color: 'inherit',
+    fontSize: 'inherit'
+  }), "".concat(componentCls).concat(componentCls, "-status"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-status-dot"), _defineProperty({}, "&".concat(componentCls, "-status-default"), {
     backgroundColor: token.colorFill
   })), "".concat(componentCls, "-status-icon"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
     // remove dot style
@@ -32,8 +28,9 @@ export var genBadgeStyle = function genBadgeStyle(token) {
     color: token.colorWarning
   })), "".concat(componentCls, "-status-text"), {
     marginInlineStart: token.marginXS,
-    // inherit color from parent instead of fixed colorText
-    color: 'inherit'
+    // inherit style from parent
+    color: 'inherit',
+    fontSize: 'inherit'
   }));
 };
 export default (function (prefixCls) {

package/es/card/index.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["children", "size", "title", "tabList", "divided", "prefixCls", "bodyStyle", "styles", "className"];
+var _excluded = ["children", "size", "title", "tabList", "tabProps", "divided", "prefixCls", "bodyStyle", "styles", "className"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -24,6 +24,7 @@ var Card = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     size = _ref.size,
     title = _ref.title,
     tabList = _ref.tabList,
+    tabProps = _ref.tabProps,
     outerDivided = _ref.divided,
     customizePrefixCls = _ref.prefixCls,
     bodyStyle = _ref.bodyStyle,
@@ -62,6 +63,9 @@ var Card = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     size: size,
     title: title,
     tabList: newTabList,
+    tabProps: _objectSpread({
+      size: 'middle'
+    }, tabProps),
     prefixCls: customizePrefixCls,
     bodyStyle: bodyStyle,
     styles: styles,

package/es/card/style/index.js

@@ -28,9 +28,15 @@ export var genCardStyle = function genCardStyle(token) {
     paddingSM = token.paddingSM,
     paddingLG = token.paddingLG;
   var tableComponentCls = "".concat(antCls, "-table");
-  return _ref2 = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_ref2, "".concat(componentCls), _defineProperty({}, "".concat(componentCls, ":not(").concat(componentCls, "-bordered):not(").concat(componentCls, "-type-inner)"), {
+  return _ref2 = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_ref2, "".concat(componentCls), _defineProperty(_defineProperty({}, "".concat(componentCls, ":not(").concat(componentCls, "-bordered):not(").concat(componentCls, "-type-inner)"), {
     boxShadow: 'none'
-  })), "".concat(componentCls).concat(componentCls, "-no-divider"), _defineProperty({}, "".concat(componentCls, "-head"), _defineProperty({
+  }), "".concat(componentCls), _defineProperty({
+    borderRadius: token.borderRadiusLG - 2
+  }, "".concat(componentCls), _defineProperty({
+    borderRadius: token.borderRadius
+  }, "".concat(componentCls), {
+    borderRadius: token.borderRadiusSM
+  })))), "".concat(componentCls).concat(componentCls, "-no-divider"), _defineProperty({}, "".concat(componentCls, "-head"), _defineProperty({
     // should not remove border-bottom to avoid tabs inkbar display correctly
     borderBottomColor: 'transparent'
   }, tabsComponentCls, _defineProperty({}, "&".concat(tabsComponentCls, "-top, &").concat(tabsComponentCls, "-bottom"), _defineProperty({}, "".concat(tabsComponentCls, "-nav::before"), {

package/es/descriptions/style/index.js

@@ -9,7 +9,7 @@ export var genVerticalStyle = function genVerticalStyle(size, token) {
   var componentCls = token.componentCls;
   var paddingMap = {
     default: {
-      paddingIn: token.paddingXS,
+      paddingIn: token.paddingXXS,
       paddingOut: token.paddingLG
     },
     middle: {
@@ -22,10 +22,12 @@ export var genVerticalStyle = function genVerticalStyle(size, token) {
     }
   };
   var paddingConfig = paddingMap[size];
-  return _defineProperty({}, "&".concat(componentCls).concat(componentCls, "-vertical:not(").concat(componentCls, "-bordered)"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-row:nth-child(2n + 1)"), _defineProperty({}, "& > th, & > td", {
+  return _defineProperty({}, "&".concat(componentCls).concat(componentCls, "-vertical:not(").concat(componentCls, "-bordered)"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-row:nth-child(2n + 1)"), _defineProperty({}, "& > th, & > td", {
     paddingBottom: paddingConfig.paddingIn
   })), "".concat(componentCls, "-row:nth-child(2n)"), _defineProperty({}, "& > th, & > td", {
     paddingBottom: paddingConfig.paddingOut
+  })), "".concat(componentCls, "-item"), _defineProperty({}, "".concat(componentCls, "-item-label"), {
+    fontSize: token.fontSizeSM
   })));
 };
 export var genDescriptionsStyle = function genDescriptionsStyle(token) {

package/es/table/style/index.js

@@ -46,9 +46,7 @@ export var genTableStyle = function genTableStyle(token) {
     borderBottom: 'none'
   })), "tr > td", {
     transition: "background ".concat(token.motionDurationMid)
-  }), "".concat(componentCls, "-placeholder td"), {
-    borderBottom: 'none'
-  }), "".concat(componentCls, "-empty-wrapper"), {
+  }), "".concat(componentCls, "-placeholder td"), {}), "".concat(componentCls, "-empty-wrapper"), {
     minHeight: 360 - token.paddingSM * 2,
     display: 'flex',
     justifyContent: 'center',

package/es/tabs/style/index.js

@@ -14,11 +14,10 @@ export var genTabsStyle = function genTabsStyle(token) {
     border: 'none'
   }))), "".concat(componentCls, "-tab"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-tab-tag"), {
     color: colorTextSecondary,
-    fontFamily: 'PingFangSC',
     fontSize: 12,
     borderRadius: 12,
     marginInlineEnd: 0,
-    height: 20
+    height: token.controlHeightSM
   }), "".concat(componentCls, "-tab-badge"), _defineProperty(_defineProperty({}, ">".concat(antCls, "-badge-count"), {
     color: colorTextSecondary,
     backgroundColor: colorFillQuaternary

package/es/theme/default.js

@@ -19,6 +19,7 @@ var colorFillQuaternary = '#F8FAFE';
 var colorFillHover = '#EFF3FA';
 var colorFillSelected = '#E2E8F3';
 var colorBorderSecondary = colorFillSecondary;
+var fontSizeSM = 12;
 // Calculated by colorBorder and getWeakenBorderColor()
 var tagColorBorder = '#cdd5e466';
 export var fontFamilyEn = "Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans', 'Segoe UI', 'Helvetica Neue', 'Helvetica, Arial', 'Apple Color Emoji'";
@@ -27,13 +28,20 @@ var defaultTheme = {
     fontFamily: "-apple-system, 'Noto Sans', BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'",
     fontFamilyCode: "Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace",
     borderRadius: 4,
-    borderRadiusLG: 6,
+    borderRadiusLG: 8,
     borderRadiusSM: 2,
     fontSize: 13,
-    fontSizeSM: 12,
+    fontSizeSM: fontSizeSM,
+    fontSizeLG: 16,
+    fontSizeHeading1: 24,
+    fontSizeHeading2: 20,
+    fontSizeHeading3: 18,
+    fontSizeHeading4: 16,
+    fontSizeHeading5: 13,
+    controlHeight: 28,
     colorPrimary: colorPrimary,
     colorInfo: colorPrimary,
-    colorInfoBorder: '#598CF3',
+    colorInfoBorder: colorPrimarySecondary,
     colorInfoBg: '#EAF1FF',
     colorInfoText: '#083E8B',
     colorSuccess: '#14B781',
@@ -74,11 +82,8 @@ var defaultTheme = {
     lineWidthFocus: 0
   },
   components: {
-    Badge: {
-      colorInfo: colorPrimarySecondary
-    },
     Breadcrumb: {
-      fontSize: 12,
+      fontSize: fontSizeSM,
       // @ts-ignore
       // fontHeight is internal token
       fontHeight: 20,
@@ -91,6 +96,9 @@ var defaultTheme = {
     Collapse: {
       colorBorder: colorBorderSecondary
     },
+    Descriptions: {
+      labelColor: colorTextSecondary
+    },
     InputNumber: {
       handleVisible: true
     },
@@ -115,6 +123,9 @@ var defaultTheme = {
       handleActiveColor: '#5189fb',
       handleColorDisabled: '#b3ccff'
     },
+    Skeleton: {
+      blockRadius: 4
+    },
     Tabs: {
       horizontalItemGutter: 24,
       itemActiveColor: colorText,
@@ -126,11 +137,11 @@ var defaultTheme = {
       colorBorder: tagColorBorder
     },
     Table: {
-      cellFontSize: 12,
+      cellFontSize: fontSizeSM,
       headerSplitColor: 'transparent',
-      cellPaddingBlock: 12,
+      cellPaddingBlock: 8,
       cellPaddingInline: 16,
-      cellPaddingBlockMD: 8,
+      cellPaddingBlockMD: 6,
       cellPaddingBlockSM: 4,
       rowHoverBg: colorFillQuaternary,
       rowSelectedBg: colorFillQuaternary,

package/es/theme/style/aliyun.less

@@ -402,7 +402,7 @@
 @sizeXS: 8px;
 @sizeXXS: 4px;
 @controlHeightSM: 24px;
-@controlHeightXS: 16px;
+@controlHeightXS: 14px;
 @controlHeightLG: 36px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;

package/es/theme/style/compact.less

@@ -374,13 +374,13 @@
 @colorBgMask: rgba(19, 32, 57, 0.45);
 @colorWhite: #fff;
 @fontSizeSM: 12px;
-@fontSizeLG: 12px;
+@fontSizeLG: 16px;
 @fontSizeXL: 14px;
-@fontSizeHeading1: 26px;
-@fontSizeHeading2: 22px;
+@fontSizeHeading1: 24px;
+@fontSizeHeading2: 20px;
 @fontSizeHeading3: 18px;
-@fontSizeHeading4: 14px;
-@fontSizeHeading5: 12px;
+@fontSizeHeading4: 16px;
+@fontSizeHeading5: 13px;
 @lineHeight: 1.8;
 @lineHeightLG: 1.6666666666666667;
 @lineHeightSM: 2;
@@ -401,16 +401,16 @@
 @sizeSM: 8px;
 @sizeXS: 4px;
 @sizeXXS: 4px;
-@controlHeightSM: 21px;
-@controlHeightXS: 14px;
-@controlHeightLG: 35px;
+@controlHeightSM: 18px;
+@controlHeightXS: 12px;
+@controlHeightLG: 30px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;
 @motionDurationSlow: 0.3s;
 @lineWidthBold: 2px;
 @borderRadiusXS: 1px;
 @borderRadiusSM: 2px;
-@borderRadiusLG: 6px;
+@borderRadiusLG: 8px;
 @borderRadiusOuter: 4px;
 @colorIcon: #8592ad;
 @boxShadow: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);

package/es/theme/style/dark.less

@@ -38,7 +38,7 @@
 @sizeUnit: 4px;
 @sizeStep: 4px;
 @sizePopupArrow: 16px;
-@controlHeight: 32px;
+@controlHeight: 28px;
 @zIndexBase: 0;
 @zIndexPopupBase: 1000;
 @opacityImage: 1;
@@ -401,9 +401,9 @@
 @sizeSM: 12px;
 @sizeXS: 8px;
 @sizeXXS: 4px;
-@controlHeightSM: 24px;
-@controlHeightXS: 16px;
-@controlHeightLG: 40px;
+@controlHeightSM: 21px;
+@controlHeightXS: 14px;
+@controlHeightLG: 35px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;
 @motionDurationSlow: 0.3s;
@@ -434,7 +434,7 @@
 @fontSizeIcon: 10px;
 @lineWidthFocus: 3px;
 @controlOutlineWidth: 2px;
-@controlInteractiveSize: 16px;
+@controlInteractiveSize: 14px;
 @controlItemBgHover: rgba(255,255,255,0.08);
 @controlItemBgActive: #122e57;
 @controlItemBgActiveHover: #113c78;

package/es/theme/style/default.less

@@ -38,7 +38,7 @@
 @sizeUnit: 4px;
 @sizeStep: 4px;
 @sizePopupArrow: 16px;
-@controlHeight: 32px;
+@controlHeight: 28px;
 @zIndexBase: 0;
 @zIndexPopupBase: 1000;
 @opacityImage: 1;
@@ -374,13 +374,13 @@
 @colorBgMask: rgba(19, 32, 57, 0.45);
 @colorWhite: #fff;
 @fontSizeSM: 12px;
-@fontSizeLG: 14px;
+@fontSizeLG: 16px;
 @fontSizeXL: 18px;
-@fontSizeHeading1: 34px;
-@fontSizeHeading2: 28px;
-@fontSizeHeading3: 22px;
-@fontSizeHeading4: 18px;
-@fontSizeHeading5: 14px;
+@fontSizeHeading1: 24px;
+@fontSizeHeading2: 20px;
+@fontSizeHeading3: 18px;
+@fontSizeHeading4: 16px;
+@fontSizeHeading5: 13px;
 @lineHeight: 1.6153846153846154;
 @lineHeightLG: 1.5714285714285714;
 @lineHeightSM: 1.8;
@@ -401,16 +401,16 @@
 @sizeSM: 12px;
 @sizeXS: 8px;
 @sizeXXS: 4px;
-@controlHeightSM: 24px;
-@controlHeightXS: 16px;
-@controlHeightLG: 40px;
+@controlHeightSM: 21px;
+@controlHeightXS: 14px;
+@controlHeightLG: 35px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;
 @motionDurationSlow: 0.3s;
 @lineWidthBold: 2px;
 @borderRadiusXS: 1px;
 @borderRadiusSM: 2px;
-@borderRadiusLG: 6px;
+@borderRadiusLG: 8px;
 @borderRadiusOuter: 4px;
 @colorIcon: #8592ad;
 @boxShadow: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);
@@ -437,7 +437,7 @@
 @colorWarningOutline: rgba(244,155,11,0.09);
 @fontSizeIcon: 12px;
 @controlOutlineWidth: 2px;
-@controlInteractiveSize: 16px;
+@controlInteractiveSize: 14px;
 @controlItemBgHover: #f3f6fc;
 @controlItemBgActive: #e6f4ff;
 @controlItemBgActiveHover: #b0dbff;

package/lib/badge/style/index.js

@@ -26,17 +26,15 @@ module.exports = __toCommonJS(style_exports);
 var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
 var genBadgeStyle = (token) => {
   const { componentCls } = token;
-  const dotSize = token.fontSizeLG / 2;
   return {
     [`${componentCls}`]: {
-      // inherit color from parent instead of fixed colorText
-      color: "inherit"
+      // make status text inherit parent style
+      color: "inherit",
+      fontSize: "inherit"
     },
     [`${componentCls}${componentCls}-status`]: {
       // dot style
       [`${componentCls}-status-dot`]: {
-        width: dotSize,
-        height: dotSize,
         [`&${componentCls}-status-default`]: {
           backgroundColor: token.colorFill
         }
@@ -66,8 +64,9 @@ var genBadgeStyle = (token) => {
       },
       [`${componentCls}-status-text`]: {
         marginInlineStart: token.marginXS,
-        // inherit color from parent instead of fixed colorText
-        color: "inherit"
+        // inherit style from parent
+        color: "inherit",
+        fontSize: "inherit"
       }
     }
   };

package/lib/card/index.js

@@ -48,6 +48,7 @@ var Card = import_react.default.forwardRef(
     size,
     title,
     tabList,
+    tabProps,
     divided: outerDivided,
     prefixCls: customizePrefixCls,
     bodyStyle,
@@ -87,6 +88,10 @@ var Card = import_react.default.forwardRef(
           size,
           title,
           tabList: newTabList,
+          tabProps: {
+            size: "middle",
+            ...tabProps
+          },
           prefixCls: customizePrefixCls,
           bodyStyle,
           styles,

package/lib/card/style/index.js

@@ -62,6 +62,16 @@ var genCardStyle = (token) => {
       // nested Card style
       [`${componentCls}:not(${componentCls}-bordered):not(${componentCls}-type-inner)`]: {
         boxShadow: "none"
+      },
+      // nested Card border radius
+      [`${componentCls}`]: {
+        borderRadius: token.borderRadiusLG - 2,
+        [`${componentCls}`]: {
+          borderRadius: token.borderRadius,
+          [`${componentCls}`]: {
+            borderRadius: token.borderRadiusSM
+          }
+        }
       }
     },
     [`${componentCls}${componentCls}-no-divider`]: {

package/lib/descriptions/style/index.js

@@ -29,7 +29,7 @@ var genVerticalStyle = (size, token) => {
   const { componentCls } = token;
   const paddingMap = {
     default: {
-      paddingIn: token.paddingXS,
+      paddingIn: token.paddingXXS,
       paddingOut: token.paddingLG
     },
     middle: {
@@ -54,6 +54,11 @@ var genVerticalStyle = (size, token) => {
         [`& > th, & > td`]: {
           paddingBottom: paddingConfig.paddingOut
         }
+      },
+      [`${componentCls}-item`]: {
+        [`${componentCls}-item-label`]: {
+          fontSize: token.fontSizeSM
+        }
       }
     }
   };

package/lib/table/style/index.js

@@ -91,9 +91,7 @@ var genTableStyle = (token) => {
           transition: `background ${token.motionDurationMid}`
         },
         // empty style
-        [`${componentCls}-placeholder td`]: {
-          borderBottom: "none"
-        },
+        [`${componentCls}-placeholder td`]: {},
         [`${componentCls}-empty-wrapper`]: {
           minHeight: 360 - token.paddingSM * 2,
           display: "flex",
@@ -143,7 +141,7 @@ var genTableStyle = (token) => {
         borderRadius: `0px 0px ${token.borderRadiusLG}px ${token.borderRadiusLG}px`
       }
     },
-    // 带边框的表格样式
+    // 带内部边框的表格样式
     [`${componentCls}-wrapper${componentCls}-inner-bordered ${componentCls}-bordered`]: {
       [`${componentCls}-container`]: {
         borderInlineStart: "none",

package/lib/tabs/style/index.js

@@ -40,11 +40,10 @@ var genTabsStyle = (token) => {
         /** @deprecated */
         [`${componentCls}-tab-tag`]: {
           color: colorTextSecondary,
-          fontFamily: "PingFangSC",
           fontSize: 12,
           borderRadius: 12,
           marginInlineEnd: 0,
-          height: 20
+          height: token.controlHeightSM
         },
         [`${componentCls}-tab-badge`]: {
           [`>${antCls}-badge-count`]: {

package/lib/theme/default.js

@@ -35,6 +35,7 @@ var colorFillSecondary = "#E2E8F3";
 var colorFillTertiary = "#F3F6FC";
 var colorFillQuaternary = "#F8FAFE";
 var colorBorderSecondary = colorFillSecondary;
+var fontSizeSM = 12;
 var tagColorBorder = "#cdd5e466";
 var fontFamilyEn = `Inter, 'Noto sans', sans-serif, Roboto, 'Open Sans', 'Segoe UI', 'Helvetica Neue', 'Helvetica, Arial', 'Apple Color Emoji'`;
 var defaultTheme = {
@@ -42,13 +43,20 @@ var defaultTheme = {
     fontFamily: `-apple-system, 'Noto Sans', BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'`,
     fontFamilyCode: `Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace`,
     borderRadius: 4,
-    borderRadiusLG: 6,
+    borderRadiusLG: 8,
     borderRadiusSM: 2,
     fontSize: 13,
-    fontSizeSM: 12,
+    fontSizeSM,
+    fontSizeLG: 16,
+    fontSizeHeading1: 24,
+    fontSizeHeading2: 20,
+    fontSizeHeading3: 18,
+    fontSizeHeading4: 16,
+    fontSizeHeading5: 13,
+    controlHeight: 28,
     colorPrimary,
     colorInfo: colorPrimary,
-    colorInfoBorder: "#598CF3",
+    colorInfoBorder: colorPrimarySecondary,
     colorInfoBg: "#EAF1FF",
     colorInfoText: "#083E8B",
     colorSuccess: "#14B781",
@@ -89,11 +97,8 @@ var defaultTheme = {
     lineWidthFocus: 0
   },
   components: {
-    Badge: {
-      colorInfo: colorPrimarySecondary
-    },
     Breadcrumb: {
-      fontSize: 12,
+      fontSize: fontSizeSM,
       // @ts-ignore
       // fontHeight is internal token
       fontHeight: 20,
@@ -106,6 +111,9 @@ var defaultTheme = {
     Collapse: {
       colorBorder: colorBorderSecondary
     },
+    Descriptions: {
+      labelColor: colorTextSecondary
+    },
     InputNumber: {
       handleVisible: true
     },
@@ -130,6 +138,9 @@ var defaultTheme = {
       handleActiveColor: "#5189fb",
       handleColorDisabled: "#b3ccff"
     },
+    Skeleton: {
+      blockRadius: 4
+    },
     Tabs: {
       horizontalItemGutter: 24,
       itemActiveColor: colorText,
@@ -141,11 +152,11 @@ var defaultTheme = {
       colorBorder: tagColorBorder
     },
     Table: {
-      cellFontSize: 12,
+      cellFontSize: fontSizeSM,
       headerSplitColor: "transparent",
-      cellPaddingBlock: 12,
+      cellPaddingBlock: 8,
       cellPaddingInline: 16,
-      cellPaddingBlockMD: 8,
+      cellPaddingBlockMD: 6,
       cellPaddingBlockSM: 4,
       rowHoverBg: colorFillQuaternary,
       rowSelectedBg: colorFillQuaternary,

package/lib/theme/style/aliyun.less

@@ -402,7 +402,7 @@
 @sizeXS: 8px;
 @sizeXXS: 4px;
 @controlHeightSM: 24px;
-@controlHeightXS: 16px;
+@controlHeightXS: 14px;
 @controlHeightLG: 36px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;

package/lib/theme/style/compact.less

@@ -374,13 +374,13 @@
 @colorBgMask: rgba(19, 32, 57, 0.45);
 @colorWhite: #fff;
 @fontSizeSM: 12px;
-@fontSizeLG: 12px;
+@fontSizeLG: 16px;
 @fontSizeXL: 14px;
-@fontSizeHeading1: 26px;
-@fontSizeHeading2: 22px;
+@fontSizeHeading1: 24px;
+@fontSizeHeading2: 20px;
 @fontSizeHeading3: 18px;
-@fontSizeHeading4: 14px;
-@fontSizeHeading5: 12px;
+@fontSizeHeading4: 16px;
+@fontSizeHeading5: 13px;
 @lineHeight: 1.8;
 @lineHeightLG: 1.6666666666666667;
 @lineHeightSM: 2;
@@ -401,16 +401,16 @@
 @sizeSM: 8px;
 @sizeXS: 4px;
 @sizeXXS: 4px;
-@controlHeightSM: 21px;
-@controlHeightXS: 14px;
-@controlHeightLG: 35px;
+@controlHeightSM: 18px;
+@controlHeightXS: 12px;
+@controlHeightLG: 30px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;
 @motionDurationSlow: 0.3s;
 @lineWidthBold: 2px;
 @borderRadiusXS: 1px;
 @borderRadiusSM: 2px;
-@borderRadiusLG: 6px;
+@borderRadiusLG: 8px;
 @borderRadiusOuter: 4px;
 @colorIcon: #8592ad;
 @boxShadow: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);

package/lib/theme/style/dark.less

@@ -38,7 +38,7 @@
 @sizeUnit: 4px;
 @sizeStep: 4px;
 @sizePopupArrow: 16px;
-@controlHeight: 32px;
+@controlHeight: 28px;
 @zIndexBase: 0;
 @zIndexPopupBase: 1000;
 @opacityImage: 1;
@@ -401,9 +401,9 @@
 @sizeSM: 12px;
 @sizeXS: 8px;
 @sizeXXS: 4px;
-@controlHeightSM: 24px;
-@controlHeightXS: 16px;
-@controlHeightLG: 40px;
+@controlHeightSM: 21px;
+@controlHeightXS: 14px;
+@controlHeightLG: 35px;
 @motionDurationFast: 0.1s;
 @motionDurationMid: 0.2s;
 @motionDurationSlow: 0.3s;
@@ -434,7 +434,7 @@
 @fontSizeIcon: 10px;
 @lineWidthFocus: 3px;
 @controlOutlineWidth: 2px;
-@controlInteractiveSize: 16px;
+@controlInteractiveSize: 14px;
 @controlItemBgHover: rgba(255,255,255,0.08);
 @controlItemBgActive: #122e57;
 @controlItemBgActiveHover: #113c78;