UI update

Signed-off-by: ryjiang <jiangruiyi@gmail.com>

client/src/components/customDialog/DialogTemplate.tsx

@@ -34,8 +34,12 @@ const useStyles = makeStyles((theme: Theme) => ({
       props.showCode ? theme.spacing(4) : 0,
   },
   actions: {
-    paddingTop: theme.spacing(2),
+    paddingTop: theme.spacing(1),
+    paddingBottom: theme.spacing(2),
     justifyContent: 'space-between',
+    '& .btn': {
+      margin: theme.spacing(.5),
+    },
   },
 }));
 
@@ -89,7 +93,11 @@ const DialogTemplate: FC<DialogContainerProps> = ({
               <div>{leftActions}</div>
               <div>
                 {showCancel && (
-                  <CustomButton onClick={onCancel} name="cancel">
+                  <CustomButton
+                    onClick={onCancel}
+                    name="cancel"
+                    className="btn"
+                  >
                     {cancel}
                   </CustomButton>
                 )}
@@ -99,6 +107,7 @@ const DialogTemplate: FC<DialogContainerProps> = ({
                   color="primary"
                   disabled={confirmDisabled}
                   name="confirm"
+                  className="btn"
                 >
                   {confirm}
                 </CustomButton>

client/src/components/menu/NavMenu.tsx

@@ -10,22 +10,19 @@ import Typography from '@mui/material/Typography';
 import { makeStyles } from '@mui/styles';
 import icons from '@/components/icons/Icons';
 
-const timeout = 150;
-const duration = `${timeout}ms`;
-
 const useStyles = makeStyles((theme: Theme) => ({
   root: {
     backgroundColor: '#fff',
-    padding: `${theme.spacing(0)}px ${theme.spacing(4)}px`,
     boxShadow: '0px 6px 30px rgba(0, 0, 0, 0.1)',
     borderRight: `1px solid ${theme.palette.divider}`,
-    transition: theme.transitions.create('width', { duration }),
     width: 48,
+    paddingTop: 0,
   },
   item: {
     width: 'initial',
     borderRadius: 8,
     margin: theme.spacing(0.5),
+    marginBottom: theme.spacing(1.5),
     cursor: 'pointer',
     '&:hover': {
       backgroundColor: theme.palette.primary.main,