Fixed Theme Color setting drawer (#569)

ant-design · Jul 18, 2020 · 814ba3d · 814ba3d
1 parent 3c4b2b6
commit 814ba3d
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 17 deletions.
diff --git a/src/SettingDrawer/ThemeColor.tsx b/src/SettingDrawer/ThemeColor.tsx
@@ -27,7 +27,6 @@ export interface ThemeColorProps {
     key: string;
     color: string;
   }[];
-  title?: string;
   value: string;
   onChange: (color: string) => void;
   formatMessage: (data: { id: any; defaultMessage?: string }) => string;
@@ -36,14 +35,13 @@ export interface ThemeColorProps {
 const ThemeColor: React.ForwardRefRenderFunction<
   HTMLDivElement,
   ThemeColorProps
-> = ({ colors, title, value, onChange, formatMessage }, ref) => {
+> = ({ colors, value, onChange, formatMessage }, ref) => {
   const colorList = colors || [];
   if (colorList.length < 1) {
     return null;
   }
   return (
     <div className="theme-color" ref={ref}>
-      <h3 className="theme-color-title">{title}</h3>
       <div className="theme-color-content">
         {colorList.map(({ key, color }) => {
           const themeKey = genThemeToString(key);

diff --git a/src/SettingDrawer/index.tsx b/src/SettingDrawer/index.tsx
@@ -575,20 +575,26 @@ const SettingDrawer: React.FC<SettingDrawerProps> = (props) => {
             onChange={(value) => changeSetting('navTheme', value, hideLoading)}
           />
         </Body>
-
-        <ThemeColor
-          title={formatMessage({ id: 'app.setting.themecolor' })}
-          value={primaryColor}
-          colors={
-            hideColors
-              ? []
-              : themeList.colorList[navTheme === 'realDark' ? 'dark' : 'light']
-          }
-          formatMessage={formatMessage}
-          onChange={(color) =>
-            changeSetting('primaryColor', color, hideLoading)
-          }
-        />
+        <Body
+          title={formatMessage({
+            id: 'app.setting.themecolor',
+            defaultMessage: 'Theme color',
+          })}
+          prefixCls={baseClassName}
+        >
+          <ThemeColor
+            value={primaryColor}
+            colors={
+              hideColors
+                ? []
+                : themeList.colorList[navTheme === 'realDark' ? 'dark' : 'light']
+            }
+            formatMessage={formatMessage}
+            onChange={(color) =>
+              changeSetting('primaryColor', color, hideLoading)
+            }
+          />
+        </Body>
 
         <Divider />