fix: modal style (#621)

vesoft-inc · Aug 22, 2023 · 90f3eef · 90f3eef
1 parent 98db360
commit 90f3eef
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 11 deletions.
diff --git a/app/app.less b/app/app.less
@@ -204,3 +204,24 @@
 .ant-table .ant-table-row {
 	background: #fff;
 }
+
+// for thoes who use command pattern to create a Modal and other components
+// just `ConfigProvider` is not enough
+.ant-modal .ant-modal-content {
+	padding: 0;
+	.ant-modal-header {
+		padding: 16px 24px;
+		border-bottom: 1px solid #f0f0f0;
+		margin-bottom: 0;
+	}
+	.ant-modal-body {
+		padding: 24px;
+		.ant-modal-confirm-body-wrapper {
+			padding: 24px 0;
+		}
+	}
+	.ant-modal-footer {
+		padding: 10px 16px;
+		border-top: 1px solid #f0f0f0;
+	}
+}
diff --git a/app/components/ErrorBoundary/index.tsx b/app/components/ErrorBoundary/index.tsx
@@ -6,7 +6,7 @@ import { Button, message } from 'antd';
 import { withRouter, RouteComponentProps } from 'react-router-dom';
 import styles from './index.module.less';
 
-type IProps = RouteComponentProps;
+type IProps = RouteComponentProps & { children: React.ReactNode };
 interface IState {
   errInfo: string;
 }

diff --git a/app/pages/Import/DatasourceList/DatasourceConfig/PlatformConfig/index.module.less b/app/pages/Import/DatasourceList/DatasourceConfig/PlatformConfig/index.module.less
@@ -2,11 +2,13 @@
 
 .dataSourceModal {
   :global {
-    .ant-modal-header {
-      border-bottom: none;
-    }
-    .ant-modal-body {
-      padding: 0 10px 35px;
+    .ant-modal-content {
+      .ant-modal-header {
+        border-bottom: none;
+      }
+      .ant-modal-body {
+        padding: 0 10px 35px;
+      }
     }
   }
   .btns {

diff --git a/app/pages/Import/TaskList/TaskItem/LogModal/index.module.less b/app/pages/Import/TaskList/TaskItem/LogModal/index.module.less
@@ -19,7 +19,7 @@
     white-space: nowrap;
   }
   :global {
-    .ant-modal-header {
+    .ant-modal-content .ant-modal-header {
       border-bottom: none;
       padding-right: 80px;
       padding-top: 15px;
@@ -32,7 +32,7 @@
         top: 5px;
       }
     }
-    .ant-modal-body {
+    .ant-modal-content .ant-modal-body {
       display: flex;
       height: 91%;
     }

diff --git a/app/pages/Import/TaskList/TemplateModal/index.module.less b/app/pages/Import/TaskList/TemplateModal/index.module.less
@@ -14,7 +14,7 @@
   .draggerTemplate {
     margin-top: 30px;
     background: #FFFFFF;
-    border: 1px dashed #000000;
+    // border: 1px dashed #000000;
     :global(.ant-upload-btn) {
       padding: 27px 30px;
       & > :global(.ant-upload-drag-container) {

diff --git a/app/pages/Schema/SchemaConfig/Create/IndexCreate/index.module.less b/app/pages/Schema/SchemaConfig/Create/IndexCreate/index.module.less
@@ -33,10 +33,10 @@
 
 .modalFieldAdd {
   :global {
-    .ant-modal-header {
+    .ant-modal-content .ant-modal-header {
       border-bottom: none;
     }
-    .ant-modal-body {
+    .ant-modal-content .ant-modal-body {
       text-align: center;
     }
   }