perf: ui

client/src/components/Markdown/Loading.tsx

@@ -4,6 +4,7 @@ import { Box } from '@chakra-ui/react';
 const Loading = () => {
 const Loading = () => {
   return (
   return (
     <Box
     <Box
+      minW={'100px'}
       w={'100%'}
       w={'100%'}
       h={'80px'}
       h={'80px'}
       backgroundImage={'url("/imgs/loading.gif")'}
       backgroundImage={'url("/imgs/loading.gif")'}

client/src/components/Markdown/MermaidCodeBlock.tsx

@@ -77,6 +77,7 @@ const MermaidBlock = ({ code }: { code: string }) => {
       <Box
       <Box
         ref={dom}
         ref={dom}
         className={styles.mermaid}
         className={styles.mermaid}
+        minW={'100px'}
         minH={'50px'}
         minH={'50px'}
         py={4}
         py={4}
         dangerouslySetInnerHTML={{ __html: svg }}
         dangerouslySetInnerHTML={{ __html: svg }}

client/src/pages/chat/components/History.tsx

@@ -147,13 +147,14 @@ const PcSliderBar = ({
         </Box>
         </Box>
       )}
       )}
       {/* chat history */}
       {/* chat history */}
-      <Box flex={'1 0 0'} h={0} overflow={'overlay'} userSelect={'none'}>
+      <Box flex={'1 0 0'} h={0} pl={2} overflowY={'scroll'} userSelect={'none'}>
         {history.map((item) => (
         {history.map((item) => (
           <Flex
           <Flex
             key={item._id}
             key={item._id}
             position={'relative'}
             position={'relative'}
             alignItems={'center'}
             alignItems={'center'}
             p={3}
             p={3}
+            borderRadius={'md'}
             mb={[2, 0]}
             mb={[2, 0]}
             cursor={'pointer'}
             cursor={'pointer'}
             transition={'background-color .2s ease-in'}
             transition={'background-color .2s ease-in'}
@@ -162,7 +163,7 @@ const PcSliderBar = ({
             }}
             }}
             {...(item._id === chatId
             {...(item._id === chatId
               ? {
               ? {
-                  backgroundImage: `${theme.lgColor.activeBlueGradient}`
+                  backgroundImage: `${theme.lgColor.activeBlueGradient}  !important`
                 }
                 }
               : {
               : {
                   bg: item.top ? 'myGray.200' : ''
                   bg: item.top ? 'myGray.200' : ''

client/src/pages/index.tsx

@@ -205,7 +205,7 @@ const Home = () => {
             py={[2, 3]}
             py={[2, 3]}
             onClick={() => router.push(`/model`)}
             onClick={() => router.push(`/model`)}
           >
           >
-            点击开始
+            立即开始
           </Button>
           </Button>
         </Flex>
         </Flex>
       </Flex>
       </Flex>

client/src/pages/kb/components/KbList.tsx

@@ -87,7 +87,7 @@ const KbList = ({ kbId }: { kbId: string }) => {
           />
           />
         </Tooltip>
         </Tooltip>
       </Flex>
       </Flex>
-      <Box flex={'1 0 0'} h={0} overflow={'overlay'} userSelect={'none'}>
+      <Box flex={'1 0 0'} h={0} pl={[0, 2]} overflowY={'scroll'} userSelect={'none'}>
         {kbs.map((item) => (
         {kbs.map((item) => (
           <Flex
           <Flex
             key={item._id}
             key={item._id}
@@ -97,6 +97,8 @@ const KbList = ({ kbId }: { kbId: string }) => {
             mb={[2, 0]}
             mb={[2, 0]}
             cursor={'pointer'}
             cursor={'pointer'}
             transition={'background-color .2s ease-in'}
             transition={'background-color .2s ease-in'}
+            borderRadius={['', 'md']}
+            borderBottom={['1px solid #f4f4f4', 'none']}
             _hover={{
             _hover={{
               backgroundImage: ['', theme.lgColor.hoverBlueGradient]
               backgroundImage: ['', theme.lgColor.hoverBlueGradient]
             }}
             }}

client/src/pages/model/components/ModelList.tsx

@@ -119,7 +119,7 @@ const ModelList = ({ modelId }: { modelId: string }) => {
           onChange={(id: any) => setCurrentTab(id)}
           onChange={(id: any) => setCurrentTab(id)}
         />
         />
       </Flex>
       </Flex>
-      <Box flex={'1 0 0'} h={0} overflow={'overlay'} userSelect={'none'}>
+      <Box flex={'1 0 0'} h={0} pl={[0, 2]} overflowY={'scroll'} userSelect={'none'}>
         {currentModels.list.map((item) => (
         {currentModels.list.map((item) => (
           <Flex
           <Flex
             key={item._id}
             key={item._id}
@@ -129,6 +129,8 @@ const ModelList = ({ modelId }: { modelId: string }) => {
             mb={[2, 0]}
             mb={[2, 0]}
             cursor={'pointer'}
             cursor={'pointer'}
             transition={'background-color .2s ease-in'}
             transition={'background-color .2s ease-in'}
+            borderRadius={['', 'md']}
+            borderBottom={['1px solid #f4f4f4', 'none']}
             _hover={{
             _hover={{
               backgroundImage: ['', theme.lgColor.hoverBlueGradient]
               backgroundImage: ['', theme.lgColor.hoverBlueGradient]
             }}
             }}

client/src/pages/model/components/detail/components/ModelEditForm.tsx

@@ -269,13 +269,13 @@ ${e.password ? `密码为: ${e.password}` : ''}`;
         </Flex>
         </Flex>
         <Flex alignItems={'center'} mt={5}>
         <Flex alignItems={'center'} mt={5}>
           <Box flex={'0 0 80px'} w={0}>
           <Box flex={'0 0 80px'} w={0}>
-            收藏人数:
+            收藏人数
           </Box>
           </Box>
           <Box>{getValues('share.collection')}人</Box>
           <Box>{getValues('share.collection')}人</Box>
         </Flex>
         </Flex>
         {isOwner && (
         {isOwner && (
           <Flex mt={5} alignItems={'center'}>
           <Flex mt={5} alignItems={'center'}>
-            <Box flex={'0 0 100px'}>删除应用</Box>
+            <Box flex={'0 0 80px'}>删除应用</Box>
             <Button
             <Button
               colorScheme={'gray'}
               colorScheme={'gray'}
               variant={'base'}
               variant={'base'}