style: drawer styles

src/components/icon-font/index.tsx

@@ -2,7 +2,7 @@ import { createFromIconfontCN } from '@ant-design/icons';
 // import './iconfont/iconfont.js';
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: '//at.alicdn.com/t/c/font_4613488_5idsv7urmzf.js'
+  scriptUrl: '//at.alicdn.com/t/c/font_4613488_xvmo08q7urm.js'
 });
 
 export default IconFont;

src/components/scroller-modal/gs-drawer.tsx

@@ -2,8 +2,20 @@ import { useEscHint } from '@/hooks/use-esc-hint';
 import { CloseOutlined } from '@ant-design/icons';
 import { Button, Drawer, type DrawerProps } from 'antd';
 
+/**
+ * use ColumnWrapper to wrap content in Drawer with scroller
+ * 57px is the height of header
+ * @param props
+ * @returns
+ */
 const ScrollerModal = (props: DrawerProps) => {
-  const { title, closable = true, maskClosable = false, ...restProps } = props;
+  const {
+    title,
+    closable = true,
+    maskClosable = false,
+    styles,
+    ...restProps
+  } = props;
   const { EscHint } = useEscHint({
     enabled: !props.keyboard && props.open
   });
@@ -14,6 +26,19 @@ const ScrollerModal = (props: DrawerProps) => {
     <>
       <Drawer
         {...restProps}
+        styles={{
+          body: {
+            height: 'calc(100vh - 57px)',
+            paddingBlock: 16,
+            paddingInline: 0,
+            overflowX: 'hidden',
+            ...styles?.body
+          },
+          content: {
+            borderRadius: '6px 0 0 6px',
+            ...styles?.content
+          }
+        }}
         closable={false}
         maskClosable={maskClosable}
         title={

src/config/theme/dark.ts

@@ -10,7 +10,8 @@ export default {
       inputFontSizeLG: 14
     },
     Steps: {
-      descriptionMaxWidth: 200
+      descriptionMaxWidth: 200,
+      iconSizeSM: 20
     },
     Table: {
       headerBorderRadius: 4,

src/config/theme/light.ts

@@ -10,7 +10,8 @@ export default {
       inputFontSizeLG: 14
     },
     Steps: {
-      descriptionMaxWidth: 200
+      descriptionMaxWidth: 200,
+      iconSizeSM: 20
     },
     Table: {
       headerBorderRadius: 4,

src/hooks/use-overlay-scroller.ts

@@ -82,7 +82,9 @@ export default function useOverlayScroller(data?: {
         ...scrollbars,
         theme:
           scrollbars?.theme ||
-          (userSettings.theme === 'light' ? 'os-theme-dark' : 'os-theme-light')
+          (userSettings.theme === 'light' || !userSettings.theme
+            ? 'os-theme-dark'
+            : 'os-theme-light')
       }
     },
     events: {

src/pages/api-keys/components/add-apikey-modal/index.tsx

@@ -204,16 +204,6 @@ const AddModal: React.FC<AddModalProps> = ({
       closeIcon={false}
       maskClosable={false}
       keyboard={false}
-      styles={{
-        body: {
-          height: 'calc(100vh - 57px)',
-          padding: '16px 0',
-          overflowX: 'hidden'
-        },
-        content: {
-          borderRadius: '6px 0 0 6px'
-        }
-      }}
       width={600}
       footer={false}
     >

src/pages/llmodels/components/deploy-builtin-modal.tsx

@@ -330,16 +330,6 @@ const AddModal: React.FC<AddModalProps> = (props) => {
       closeIcon={false}
       maskClosable={false}
       keyboard={false}
-      styles={{
-        body: {
-          height: 'calc(100vh - 57px)',
-          padding: '16px 0',
-          overflowX: 'hidden'
-        },
-        content: {
-          borderRadius: '6px 0 0 6px'
-        }
-      }}
       width={width}
       footer={false}
     >

src/pages/llmodels/components/deploy-modal.tsx

@@ -536,16 +536,6 @@ const AddModal: FC<AddModalProps> = (props) => {
       closeIcon={false}
       maskClosable={false}
       keyboard={false}
-      styles={{
-        body: {
-          height: 'calc(100vh - 57px)',
-          padding: '16px 0',
-          overflowX: 'hidden'
-        },
-        content: {
-          borderRadius: '6px 0 0 6px'
-        }
-      }}
       width={width}
       footer={false}
     >

src/pages/llmodels/components/update-modal.tsx

@@ -244,16 +244,6 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
       maskClosable={false}
       keyboard={false}
       width={600}
-      styles={{
-        body: {
-          height: 'calc(100vh - 57px)',
-          padding: '16px 0',
-          overflowX: 'hidden'
-        },
-        content: {
-          borderRadius: '6px 0 0 6px'
-        }
-      }}
       footer={false}
     >
       <ColumnWrapper

src/pages/llmodels/download/index.tsx

@@ -165,16 +165,6 @@ const DownloadModel: React.FC<AddModalProps> = (props) => {
       maskClosable={false}
       keyboard={false}
       zIndex={2000}
-      styles={{
-        body: {
-          height: 'calc(100vh - 57px)',
-          padding: '16px 0',
-          overflowX: 'hidden'
-        },
-        content: {
-          borderRadius: '6px 0 0 6px'
-        }
-      }}
       width={width}
       footer={false}
     >