fix: 修复侧边栏按钮

lobehub · Nov 4, 2024 · e1ebebf · e1ebebf
1 parent ee9b7f5
commit e1ebebf
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/src/app/chat/SideBar/SessionList/index.tsx b/src/app/chat/SideBar/SessionList/index.tsx
@@ -17,6 +17,10 @@ const List = dynamic(() => import('./List'), {
 });
 
 const useStyles = createStyles(({ css, token, prefixCls }) => ({
+  session: css`
+    overflow-y: auto;
+    height: 100%;
+  `,
   list: css`
     padding: 8px;
   `,
@@ -54,7 +58,7 @@ const SessionList = () => {
   const [searchName, setSearchName] = useState<string>();
   const { t } = useTranslation('chat');
   return (
-    <>
+    <div className={styles.session}>
       <Flexbox style={{ padding: '16px 8px 0' }}>
         <SearchBar
           enableShortKey
@@ -94,7 +98,7 @@ const SessionList = () => {
           ]}
         />
       </div>
-    </>
+    </div>
   );
 };
 

diff --git a/src/app/chat/SideBar/index.tsx b/src/app/chat/SideBar/index.tsx
@@ -5,15 +5,23 @@ import { createStyles, useResponsive } from 'antd-style';
 import { rgba } from 'polished';
 import { useEffect } from 'react';
 
-import { SIDEBAR_MAX_WIDTH, SIDEBAR_WIDTH } from '@/constants/token';
+import { HEADER_HEIGHT, SIDEBAR_MAX_WIDTH, SIDEBAR_WIDTH } from '@/constants/token';
 import { useGlobalStore } from '@/store/global';
 
 import SessionList from './SessionList';
 
 const useStyles = createStyles(({ css, token }) => ({
+  content: css`
+    display: flex;
+    flex-direction: column;
+    height: 100% !important;
+  `,
   sidebar: css`
     display: flex;
     flex-direction: column;
+
+    height: calc(100vh - ${HEADER_HEIGHT}px);
+
     background-color: ${rgba(token.colorBgLayout, 0.2)};
     backdrop-filter: saturate(180%) blur(8px);
   `,
@@ -43,6 +51,7 @@ const SideBar = () => {
   return (
     <DraggablePanel
       className={styles.sidebar}
+      classNames={{ content: styles.content }}
       maxWidth={SIDEBAR_MAX_WIDTH}
       minWidth={SIDEBAR_WIDTH}
       mode={'fixed'}