fix: ui (#4979)

package.json

@@ -38,10 +38,12 @@
   },
   },
   "lint-staged": {
   "lint-staged": {
     "./**/**/*.{ts,tsx,scss}": [
     "./**/**/*.{ts,tsx,scss}": [
-      "npm run format-code",
-      "npm run lint:fix"
+      "pnpm format-code"
     ],
     ],
-    "./docSite/**/**/*.md": "npm run format-doc && npm run gen:llms"
+    "./**/**/*.{ts,tsx}": [
+      "pnpm lint:fix"
+    ],
+    "./docSite/**/**/*.md": "pnpm format-doc && pnpm gen:llms"
   },
   },
   "resolutions": {
   "resolutions": {
     "mdast-util-gfm-autolink-literal": "2.0.0"
     "mdast-util-gfm-autolink-literal": "2.0.0"

projects/app/src/pageComponents/app/detail/Workflow/components/SaveButton.tsx

-import { Box, Button, Flex, useDisclosure } from '@chakra-ui/react';
+import { Box, Button, HStack, useDisclosure } from '@chakra-ui/react';
 import MyPopover from '@fastgpt/web/components/common/MyPopover';
 import MyPopover from '@fastgpt/web/components/common/MyPopover';
 import React, { useState } from 'react';
 import React, { useState } from 'react';
 import MyIcon from '@fastgpt/web/components/common/Icon';
 import MyIcon from '@fastgpt/web/components/common/Icon';
@@ -59,9 +59,9 @@ const SaveButton = ({
         <Box p={1.5}>
         <Box p={1.5}>
           <MyBox
           <MyBox
             display={'flex'}
             display={'flex'}
-            size={'md'}
-            px={1}
-            py={1.5}
+            alignItems={'center'}
+            gap={2}
+            p={1.5}
             rounded={'4px'}
             rounded={'4px'}
             _hover={{ color: 'primary.600', bg: 'rgba(17, 24, 36, 0.05)' }}
             _hover={{ color: 'primary.600', bg: 'rgba(17, 24, 36, 0.05)' }}
             cursor={'pointer'}
             cursor={'pointer'}
@@ -78,12 +78,11 @@ const SaveButton = ({
               setIsSave(false);
               setIsSave(false);
             }}
             }}
           >
           >
-            <MyIcon name={'core/workflow/upload'} w={'16px'} mr={2} />
+            <MyIcon name={'core/workflow/upload'} w={'1rem'} />
             <Box fontSize={'sm'}>{t('common:core.workflow.Save to cloud')}</Box>
             <Box fontSize={'sm'}>{t('common:core.workflow.Save to cloud')}</Box>
           </MyBox>
           </MyBox>
-          <Flex
-            px={1}
-            py={1.5}
+          <HStack
+            p={1.5}
             rounded={'4px'}
             rounded={'4px'}
             _hover={{ color: 'primary.600', bg: 'rgba(17, 24, 36, 0.05)' }}
             _hover={{ color: 'primary.600', bg: 'rgba(17, 24, 36, 0.05)' }}
             cursor={'pointer'}
             cursor={'pointer'}
@@ -96,7 +95,7 @@ const SaveButton = ({
               setIsSave(false);
               setIsSave(false);
             }}
             }}
           >
           >
-            <MyIcon name={'core/workflow/publish'} w={'16px'} mr={2} />
+            <MyIcon name={'core/workflow/publish'} w={'1rem'} />
             <Box fontSize={'sm'}>{t('common:core.workflow.Save and publish')}</Box>
             <Box fontSize={'sm'}>{t('common:core.workflow.Save and publish')}</Box>
             {isSaveAndPublishModalOpen && (
             {isSaveAndPublishModalOpen && (
               <SaveAndPublishModal
               <SaveAndPublishModal
@@ -105,7 +104,7 @@ const SaveButton = ({
                 onClickSave={onClickSave}
                 onClickSave={onClickSave}
               />
               />
             )}
             )}
-          </Flex>
+          </HStack>
         </Box>
         </Box>
       )}
       )}
     </MyPopover>
     </MyPopover>

projects/app/src/web/styles/chakraui.scss

@@ -6,3 +6,7 @@ body select {
 .chakra-tooltip {
 .chakra-tooltip {
   font-size: var(--chakra-fontSizes-xs) !important;
   font-size: var(--chakra-fontSizes-xs) !important;
 }
 }
+
+.chakra-popover__popper > section {
+  width: auto !important;
+}