(incubator-devlake) branch fix-bugs updated: fix(config-ui): adjust the style for project detail

[mintsweet]

This is an automated email from the ASF dual-hosted git repository.

mintsweet pushed a commit to branch fix-bugs
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git


The following commit(s) were added to refs/heads/fix-bugs by this push:
     new 05c61f8e2 fix(config-ui): adjust the style for project detail
05c61f8e2 is described below

commit 05c61f8e29512e182cc3da2b4fdf57290f736414
Author: mintsweet <0x1304...@gmail.com>
AuthorDate: Thu Dec 28 19:53:01 2023 +1300

    fix(config-ui): adjust the style for project detail
---
 .../src/pages/project/detail/settings-panel.tsx    | 42 +++++++++++-----------
 1 file changed, 22 insertions(+), 20 deletions(-)

diff --git a/config-ui/src/pages/project/detail/settings-panel.tsx 
b/config-ui/src/pages/project/detail/settings-panel.tsx
index c49e8e21f..f23d19f0c 100644
--- a/config-ui/src/pages/project/detail/settings-panel.tsx
+++ b/config-ui/src/pages/project/detail/settings-panel.tsx
@@ -19,7 +19,7 @@
 import { useEffect, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { WarningOutlined } from '@ant-design/icons';
-import { Flex, Card, Modal, Input, Checkbox, Button, message } from 'antd';
+import { Flex, Space, Card, Modal, Input, Checkbox, Button, message } from 
'antd';
 
 import API from '@/api';
 import { Block } from '@/components';
@@ -101,26 +101,28 @@ export const SettingsPanel = ({ project, onRefresh }: 
Props) => {
 
   return (
     <Flex vertical>
-      <Card>
-        <Block title="Project Name" description="Edit your project name with 
letters, numbers, -, _ or /" required>
-          <Input style={{ width: 386 }} value={name} onChange={(e) => 
setName(e.target.value)} />
-        </Block>
-        <Block description="DORA metrics are four widely-adopted metrics for 
measuring software delivery performance.">
-          <Checkbox checked={enableDora} onChange={(e) => 
setEnableDora(e.target.checked)}>
-            Enable DORA Metrics
-          </Checkbox>
-        </Block>
-        <Block>
-          <Button type="primary" loading={operating} disabled={!name} 
onClick={handleUpdate}>
-            Save
+      <Space direction="vertical" size="large">
+        <Card>
+          <Block title="Project Name" description="Edit your project name with 
letters, numbers, -, _ or /" required>
+            <Input style={{ width: 386 }} value={name} onChange={(e) => 
setName(e.target.value)} />
+          </Block>
+          <Block description="DORA metrics are four widely-adopted metrics for 
measuring software delivery performance.">
+            <Checkbox checked={enableDora} onChange={(e) => 
setEnableDora(e.target.checked)}>
+              Enable DORA Metrics
+            </Checkbox>
+          </Block>
+          <Block>
+            <Button type="primary" loading={operating} disabled={!name} 
onClick={handleUpdate}>
+              Save
+            </Button>
+          </Block>
+        </Card>
+        <Flex justify="center">
+          <Button type="primary" danger onClick={handleShowDeleteDialog}>
+            Delete Project
           </Button>
-        </Block>
-      </Card>
-      <Flex justify="center">
-        <Button type="primary" danger onClick={handleShowDeleteDialog}>
-          Delete Project
-        </Button>
-      </Flex>
+        </Flex>
+      </Space>
       <Modal
         open={open}
         width={820}