diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
index e253869a..9af9d9ee 100644
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
@@ -91,5 +91,12 @@
   "convert-to-note": "Convert to Note",
   "convert-to-blinko": "Convert to Blinko",
   "reviewed": "Reviewed",
-  "congratulations-youve-reviewed-everything-today": "you've reviewed everything today."
+  "congratulations-youve-reviewed-everything-today": "you've reviewed everything today.",
+  "name-db": "NAME",
+  "schedule": "SCHEDULE",
+  "last-run": "LAST RUN",
+  "backup-file": "BACKUP FILE",
+  "status": "STATUS",
+  "running": "Running",
+  "stopped": "Stopped"
 }
diff --git a/public/locales/zh/translation.json b/public/locales/zh/translation.json
index 5f9c5d56..c385521d 100644
--- a/public/locales/zh/translation.json
+++ b/public/locales/zh/translation.json
@@ -90,5 +90,12 @@
   "convert-to-note": "转换为笔记",
   "convert-to-blinko": "转换为闪念",
   "reviewed": "已回顾",
-  "congratulations-youve-reviewed-everything-today": "恭喜你，今天你已经回顾了所有内容"
+  "congratulations-youve-reviewed-everything-today": "恭喜你，今天你已经回顾了所有内容",
+  "name-db": "名称",
+  "schedule": "计划",
+  "last-run": "最后一次运行",
+  "backup-file": "备份文件",
+  "status": "状态",
+  "running": "运行中",
+  "stopped": "已停止"
 }
diff --git a/src/components/BlinkoSettings/AiSetting.tsx b/src/components/BlinkoSettings/AiSetting.tsx
index 5f5991f2..184406ea 100644
--- a/src/components/BlinkoSettings/AiSetting.tsx
+++ b/src/components/BlinkoSettings/AiSetting.tsx
@@ -25,7 +25,7 @@ export const AiSetting = observer(() => {
     store.apiEndPoint = blinko.config.value?.aiApiEndpoint
     store.apiKey = blinko.config.value?.aiApiKey
   }, [blinko.config.value])
-  return <Card shadow="none" className="flex flex-col p-4 bg-background">
+  return <Card shadow="none" className="flex flex-col p-4 bg-background pb-6">
     <div className='text-desc text-sm'>AI</div>
     <Item
       leftContent={<>{t('use-ai')}</>}
@@ -118,7 +118,7 @@ export const AiSetting = observer(() => {
         />
       } />
     <Item
-      leftContent={<div className="flex flex-col ga-1">
+      leftContent={<div className="flex flex-col gap-1">
         <>{t('api-endpoint')}</>
         <div className="text-desc text-xs">{t('must-start-with-http-s-or-use-api-openai-as-default')}</div>
       </div>}
diff --git a/src/components/BlinkoSettings/Item.tsx b/src/components/BlinkoSettings/Item.tsx
index 1024f548..66db03c4 100644
--- a/src/components/BlinkoSettings/Item.tsx
+++ b/src/components/BlinkoSettings/Item.tsx
@@ -1,8 +1,8 @@
 import { observer } from "mobx-react-lite"
 
 export const Item = observer(({ leftContent, rightContent }: any) => {
-  return <div className="flex items-center py-2">
+  return <div className="flex flex-col md:flex-row items-center py-2">
     <div className="font-bold">{leftContent}</div>
-    <div className="ml-auto">{rightContent}</div>
+    <div className="ml-auto mt-2 md:mt-0">{rightContent}</div>
   </div>
 })
diff --git a/src/components/BlinkoSettings/TaskSetting.tsx b/src/components/BlinkoSettings/TaskSetting.tsx
index 9a055dfd..ecece803 100644
--- a/src/components/BlinkoSettings/TaskSetting.tsx
+++ b/src/components/BlinkoSettings/TaskSetting.tsx
@@ -32,14 +32,15 @@ export const TaskSetting = observer(() => {
 })
 
 const DBBackPanel = observer(() => {
+  const { t } = useTranslation()
   const blinko = RootStore.Get(BlinkoStore)
   return <> {blinko.DBTask && <Table shadow="none">
     <TableHeader>
-      <TableColumn>NAME</TableColumn>
-      <TableColumn>SCHEDULE</TableColumn>
-      <TableColumn>LAST RUN</TableColumn>
-      <TableColumn>BACKUP FILE</TableColumn>
-      <TableColumn>STATUS</TableColumn>
+      <TableColumn>{t('name-db')}</TableColumn>
+      <TableColumn>{t('schedule')}</TableColumn>
+      <TableColumn>{t('last-run')}</TableColumn>
+      <TableColumn>{t('backup-file')}</TableColumn>
+      <TableColumn>{t('status')}</TableColumn>
     </TableHeader>
     <TableBody>
       <TableRow>
@@ -58,7 +59,7 @@ const DBBackPanel = observer(() => {
           >
             {helper.cron.cornTimeList.map((item) => (
               <SelectItem key={item.value}>
-                {item.label}
+                {t(item.label)}
               </SelectItem>
             ))}
           </Select>
@@ -75,7 +76,7 @@ const DBBackPanel = observer(() => {
         <TableCell>
           <div className={`${blinko.DBTask?.isRunning ? 'text-green-500' : 'text-red-500'} flex items-center`}>
             <Icon icon="bi:dot" width="24" height="24" />
-            <div>{blinko.DBTask?.isRunning ? 'Running' : 'Stopped'}</div>
+            <div>{blinko.DBTask?.isRunning ? t('running') : t('stopped')}</div>
           </div>
         </TableCell>
       </TableRow>
diff --git a/src/pages/settings.tsx b/src/pages/settings.tsx
index d6fb9df0..afb367e9 100644
--- a/src/pages/settings.tsx
+++ b/src/pages/settings.tsx
@@ -4,17 +4,18 @@ import { AiSetting } from "@/components/BlinkoSettings/AiSetting";
 import { PerferSetting } from "@/components/BlinkoSettings/PerferSetting";
 import { TaskSetting } from "@/components/BlinkoSettings/TaskSetting";
 import { ImportSetting } from "@/components/BlinkoSettings/ImportSetting";
+import { ScrollArea } from "@/components/Common/ScrollArea";
 
 const Page = observer(() => {
-  return <>
-    <div className="px-2 md:px-6 pt-2 flex flex-col gap-8">
+  return <div className="h-mobile-full ">
+    <ScrollArea onBottom={() => { }} className="px-2 md:px-6 pt-2 pb-6 flex flex-col gap-8 ">
       <BasicSetting />
       <AiSetting />
       <PerferSetting />
       <TaskSetting />
       <ImportSetting />
-    </div >
-  </>
+    </ScrollArea >
+  </div>
 });
 
 export default Page
\ No newline at end of file