diff --git a/CHANGELOG.md b/CHANGELOG.md
index 60de3e51..bfc93852 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## 2025-03-01
+
+- 优化了移动端界面 [@guansss](https://github.com/guansss)
+- 加入广告 [@guansss](https://github.com/guansss)
+
 ## 2025-02-22
 
 - 添加了关卡筛选器的联想输入功能 [@guansss](https://github.com/guansss)
diff --git a/public/ads_mumu.jpg b/public/ads_mumu.jpg
new file mode 100644
index 00000000..d0536e6a
Binary files /dev/null and b/public/ads_mumu.jpg differ
diff --git a/src/apis/announcement.ts b/src/apis/announcement.ts
index c7b8e636..7d23801c 100644
--- a/src/apis/announcement.ts
+++ b/src/apis/announcement.ts
@@ -20,7 +20,6 @@ export function useAnnouncement() {
         .then((res) => res.text())
         .catch((e) => {
           if ((e as Error).message === 'Failed to fetch') {
-            console.warn(e)
             throw new Error('网络错误')
           }
 
diff --git a/src/components/NavExpandButton.tsx b/src/components/NavExpandButton.tsx
index bc9dfc65..a4c6124b 100644
--- a/src/components/NavExpandButton.tsx
+++ b/src/components/NavExpandButton.tsx
@@ -6,14 +6,13 @@ import { navAtom, toggleExpandNavAtom } from 'store/nav'
 
 export const NavExpandButton = () => {
   const expanded = useAtomValue(navAtom)
-  const toggleExpaned = useSetAtom(toggleExpandNavAtom)
+  const toggleExpand = useSetAtom(toggleExpandNavAtom)
 
   return (
-    <div className="sm:hidden">
-      <Button
-        onClick={toggleExpaned}
-        icon={expanded.expanded ? 'cross' : 'menu'}
-      />
-    </div>
+    <Button
+      className="md:!hidden"
+      onClick={() => toggleExpand()}
+      icon={expanded.expanded ? 'cross' : 'menu'}
+    />
   )
 }
diff --git a/src/components/announcement/AnnPanel.tsx b/src/components/announcement/AnnPanel.tsx
index 80d4de22..fb4b5f0c 100644
--- a/src/components/announcement/AnnPanel.tsx
+++ b/src/components/announcement/AnnPanel.tsx
@@ -1,7 +1,7 @@
 import { Card, Icon } from '@blueprintjs/core'
 
 import clsx from 'clsx'
-import { FC, useEffect, useMemo, useState } from 'react'
+import { FC, ReactNode, useEffect, useMemo, useState } from 'react'
 
 import { useAnnouncement } from '../../apis/announcement'
 import {
@@ -15,9 +15,10 @@ import { AnnDialog } from './AnnDialog'
 
 interface AnnPanelProps {
   className?: string
+  trigger?: (params: { handleClick: () => void }) => ReactNode
 }
 
-export const AnnPanel: FC<AnnPanelProps> = ({ className }) => {
+export const AnnPanel: FC<AnnPanelProps> = ({ className, trigger }) => {
   const { data, error } = useAnnouncement()
   const announcement = useMemo(
     () => (data ? parseAnnouncement(data) : undefined),
@@ -45,34 +46,36 @@ export const AnnPanel: FC<AnnPanelProps> = ({ className }) => {
     }
   }, [announcement, lastNoticed, setLastNoticed])
 
+  const handleClick = () => {
+    setIsOpen({ yes: true, manually: true })
+    setDisplaySections(announcement?.sections)
+  }
+
+  trigger ??= ({ handleClick }) => (
+    <Card interactive className={clsx(className)} onClick={handleClick}>
+      <CardTitle icon="info-sign">公告</CardTitle>
+
+      <div className="flex">
+        {announcement && (
+          <ul className="grow list-disc pl-4">
+            {announcement?.sections
+              .slice(0, 3)
+              .map(({ title }) => <li key={title}>{title}</li>)}
+          </ul>
+        )}
+        {!announcement && error && (
+          <div className="grow text-red-500">
+            公告加载失败：{formatError(error)}
+          </div>
+        )}
+        <Icon className="self-end" icon="more" size={14} />
+      </div>
+    </Card>
+  )
+
   return (
     <>
-      <Card
-        interactive
-        className={clsx(className)}
-        onClick={() => {
-          setIsOpen({ yes: true, manually: true })
-          setDisplaySections(announcement?.sections)
-        }}
-      >
-        <CardTitle icon="info-sign">公告</CardTitle>
-
-        <div className="flex">
-          {announcement && (
-            <ul className="grow list-disc pl-4">
-              {announcement?.sections
-                .slice(0, 3)
-                .map(({ title }) => <li key={title}>{title}</li>)}
-            </ul>
-          )}
-          {!announcement && error && (
-            <div className="grow text-red-500">
-              公告加载失败：{formatError(error)}
-            </div>
-          )}
-          <Icon className="self-end" icon="more" size={14} />
-        </div>
-      </Card>
+      {trigger({ handleClick })}
       <AnnDialog
         sections={displaySections}
         isOpen={!!isOpen?.yes}
diff --git a/src/components/drawer/DrawerLayout.tsx b/src/components/drawer/DrawerLayout.tsx
index 2e824fac..3d65b28b 100644
--- a/src/components/drawer/DrawerLayout.tsx
+++ b/src/components/drawer/DrawerLayout.tsx
@@ -5,7 +5,7 @@ export const DrawerLayout: FCC<{
 }> = ({ title, children }) => {
   return (
     <section className="flex flex-col relative h-full">
-      <div className="px-8 py-2 text-lg font-medium flex items-center bg-slate-100 shadow w-full h-12 dark:bg-slate-900 dark:text-white">
+      <div className="px-4 md:px-8 py-2 text-lg font-medium flex flex-wrap items-center bg-slate-100 shadow w-full min-h-12 dark:bg-slate-900 dark:text-white">
         {title}
       </div>
 
diff --git a/src/components/drawer/NavAside.tsx b/src/components/drawer/NavAside.tsx
index 9c829590..4b15c1ca 100644
--- a/src/components/drawer/NavAside.tsx
+++ b/src/components/drawer/NavAside.tsx
@@ -1,48 +1,100 @@
-import { Button, Portal } from '@blueprintjs/core'
+import { Drawer, Menu, MenuDivider } from '@blueprintjs/core'
+import { MenuItem2 } from '@blueprintjs/popover2'
 
 import { useAtomValue, useSetAtom } from 'jotai'
-import { LINKS } from 'layouts/AppLayout'
+import { useState } from 'react'
 import { NavLink } from 'react-router-dom'
 
 import { navAtom, toggleExpandNavAtom } from 'store/nav'
 
+import { NAV_LINKS, SOCIAL_LINKS } from '../../links'
+import { useCurrentSize } from '../../utils/useCurrenSize'
+import { AnnPanel } from '../announcement/AnnPanel'
+import { OperationSetEditorDialog } from '../operation-set/OperationSetEditor'
+
 export const NavAside = () => {
+  const { isMD } = useCurrentSize()
   const nav = useAtomValue(navAtom)
   const toggleNav = useSetAtom(toggleExpandNavAtom)
-  const navLinks = [...LINKS]
 
-  if (!nav.expanded) return null
+  const [showOperationSetDialog, setShowOperationSetDialog] = useState(false)
+
+  if (!isMD) return null
 
   return (
-    <Portal>
-      {/* todo: 这里可以重写移动端header 需要去掉top */}
-      <div className="fixed inset-0 top-14 z-50 overflow-y-auto backdrop-blur-lg sm:hidden">
-        <div className="px-4 sm:px-6 pt-3 pb-6">
-          <nav className="flex flex-col gap-3">
-            {navLinks.map((link) => (
-              <div className="flex-col w-full" key={link.to}>
-                <NavLink
-                  to={link.to}
-                  className="text-sm text-zinc-600 dark:text-slate-100 !no-underline"
+    <>
+      <Drawer
+        isOpen={isMD && !!nav.expanded}
+        onClose={() => toggleNav()}
+        position="left"
+        size="100%"
+        portalClassName="[&>.bp4-overlay-container]:z-10"
+        backdropClassName="bg-transparent"
+        className="bg-transparent backdrop-blur-lg overflow-y-auto mt-14 p-2"
+      >
+        <Menu className="p-0 space-y-2 bg-transparent font-bold">
+          {NAV_LINKS.map((link) => (
+            <NavLink key={link.to} to={link.to} className="block !no-underline">
+              {({ isActive }) => (
+                <MenuItem2
+                  key={link.to}
+                  icon={link.icon}
+                  active={isActive}
+                  text={link.label}
+                  className="p-2 rounded-md"
+                  tagName="div"
                   onClick={() => toggleNav()}
-                >
-                  {({ isActive }) => (
-                    <Button
-                      minimal
-                      icon={link.icon}
-                      active={isActive}
-                      className="w-full flex items-center"
-                      style={{ justifyContent: 'flex-start' }}
-                    >
-                      {link.label}
-                    </Button>
-                  )}
-                </NavLink>
-              </div>
-            ))}
-          </nav>
+                />
+              )}
+            </NavLink>
+          ))}
+          <MenuDivider />
+          <MenuItem2
+            icon="folder-new"
+            text="创建作业集..."
+            className="p-2 rounded-md"
+            onClick={() => {
+              setShowOperationSetDialog(true)
+              toggleNav()
+            }}
+          />
+          <AnnPanel
+            trigger={({ handleClick }) => (
+              <MenuItem2
+                icon="info-sign"
+                text="公告"
+                className="p-2 rounded-md"
+                onClick={handleClick}
+              />
+            )}
+          />
+          <MenuDivider />
+        </Menu>
+        <div className="flex flex-wrap leading-relaxed mt-2 p-2 section-social-links">
+          {SOCIAL_LINKS.map((link) => (
+            <a
+              href={link.href}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="flex items-center text-zinc-600 dark:text-slate-100 no-underline"
+            >
+              {link.icon}
+              <span>{link.label}</span>
+            </a>
+          )).reduce((prev, curr) => (
+            <>
+              {prev}
+              <div className="mx-2 opacity-50">·</div>
+              {curr}
+            </>
+          ))}
         </div>
-      </div>
-    </Portal>
+      </Drawer>
+
+      <OperationSetEditorDialog
+        isOpen={showOperationSetDialog}
+        onClose={() => setShowOperationSetDialog(false)}
+      />
+    </>
   )
 }
diff --git a/src/components/viewer/OperationViewer.tsx b/src/components/viewer/OperationViewer.tsx
index c5e3cdda..3f8fed95 100644
--- a/src/components/viewer/OperationViewer.tsx
+++ b/src/components/viewer/OperationViewer.tsx
@@ -189,38 +189,33 @@ export const OperationViewer: ComponentType<{
 
             <div className="flex-1" />
 
-            {operation.uploaderId === auth.userId && (
-              <Popover2
-                content={
-                  <ManageMenu
-                    operation={operation}
-                    onUpdate={() => onCloseDrawer()}
-                  />
-                }
-              >
-                <Button
-                  className="ml-4"
-                  icon="wrench"
-                  text="管理"
-                  rightIcon="caret-down"
-                />
-              </Popover2>
-            )}
-
-            <Button
-              className="ml-4"
-              icon="download"
-              text="下载原 JSON"
-              onClick={() => handleDownloadJSON(operation.parsedContent)}
-            />
+            <div className="flex flex-wrap items-center gap-2 md:gap-4">
+              {operation.uploaderId === auth.userId && (
+                <Popover2
+                  content={
+                    <ManageMenu
+                      operation={operation}
+                      onUpdate={() => onCloseDrawer()}
+                    />
+                  }
+                >
+                  <Button icon="wrench" text="管理" rightIcon="caret-down" />
+                </Popover2>
+              )}
+
+              <Button
+                icon="download"
+                text="下载原 JSON"
+                onClick={() => handleDownloadJSON(operation.parsedContent)}
+              />
 
-            <Button
-              className="ml-4"
-              icon="clipboard"
-              text="复制神秘代码"
-              intent="primary"
-              onClick={() => copyShortCode(operation)}
-            />
+              <Button
+                icon="clipboard"
+                text="复制神秘代码"
+                intent="primary"
+                onClick={() => copyShortCode(operation)}
+              />
+            </div>
           </>
         }
       >
@@ -276,10 +271,10 @@ function OperationViewerInner({
   handleRating: (decision: OpRatingType) => Promise<void>
 }) {
   return (
-    <div className="h-full overflow-auto py-4 px-8 pt-8">
+    <div className="h-full overflow-auto p-4 md:p-8">
       <H3>{operation.parsedContent.doc.title}</H3>
 
-      <div className="grid grid-rows-1 grid-cols-3 gap-8">
+      <div className="flex flex-col-reverse md:grid grid-rows-1 grid-cols-3 gap-2 md:gap-8">
         <div className="flex flex-col">
           <Paragraphs content={operation.parsedContent.doc.details} linkify />
         </div>
@@ -330,20 +325,20 @@ function OperationViewerInner({
           </FactItem>
         </div>
 
-        <div className="flex flex-col items-start select-none tabular-nums">
-          <FactItem title="浏览量" icon="eye-open">
+        <div className="flex flex-wrap md:flex-col items-start select-none tabular-nums gap-4">
+          <FactItem dense title="浏览量" icon="eye-open">
             <span className="text-gray-800 dark:text-slate-100 font-bold">
               {operation.views}
             </span>
           </FactItem>
 
-          <FactItem title="发布于" icon="time">
+          <FactItem dense title="发布于" icon="time">
             <span className="text-gray-800 dark:text-slate-100 font-bold">
               <RelativeTime moment={operation.uploadTime} />
             </span>
           </FactItem>
 
-          <FactItem title="作者" icon="user">
+          <FactItem dense title="作者" icon="user">
             <UserName
               className="text-gray-800 dark:text-slate-100 font-bold"
               userId={operation.uploaderId}
@@ -409,7 +404,7 @@ function OperationViewerInnerDetails({ operation }: { operation: Operation }) {
         />
       </H4>
       <Collapse isOpen={showOperators}>
-        <div className="mt-2 flex flex-wrap -ml-4">
+        <div className="mt-2 flex flex-wrap -ml-4 gap-y-2">
           {!operation.parsedContent.opers?.length &&
             !operation.parsedContent.groups?.length && (
               <NonIdealState
@@ -432,7 +427,7 @@ function OperationViewerInnerDetails({ operation }: { operation: Operation }) {
               key={group.name}
             >
               <H6 className="text-gray-800">{group.name}</H6>
-              <div className="flex gap-1">
+              <div className="flex flex-wrap gap-y-2">
                 {group.opers
                   ?.filter(Boolean)
                   .map((operator) => (
diff --git a/src/layouts/AppLayout.tsx b/src/layouts/AppLayout.tsx
index 372f0161..3697d656 100644
--- a/src/layouts/AppLayout.tsx
+++ b/src/layouts/AppLayout.tsx
@@ -1,4 +1,4 @@
-import { Button, IconName, Navbar, Tag } from '@blueprintjs/core'
+import { Button, Navbar, Tag } from '@blueprintjs/core'
 
 import { Link, NavLink } from 'react-router-dom'
 import { FCC } from 'types'
@@ -9,33 +9,13 @@ import { NavExpandButton } from 'components/NavExpandButton'
 import { ThemeSwitchButton } from 'components/ThemeSwitchButton'
 import { NavAside } from 'components/drawer/NavAside'
 
-export const LINKS: {
-  to: string
-  label: string
-  icon: IconName
-}[] = [
-  {
-    to: '/',
-    label: '首页',
-    icon: 'home',
-  },
-  {
-    to: '/create',
-    label: '创建作业',
-    icon: 'add',
-  },
-  {
-    to: '/about',
-    label: '关于',
-    icon: 'info-sign',
-  },
-]
+import { NAV_LINKS } from '../links'
 
 // const darkMode = localStorage.getItem('darkMode') === 'true'
 
 export const AppLayout: FCC = ({ children }) => (
   <div className="flex flex-col h-full w-full bg-zinc-50 ">
-    <Navbar className="flex w-full px-8 py-2 items-center bg-zinc-100 shadow fixed h-14 z-10 whitespace-nowrap overflow-x-none overflow-y-hidden">
+    <Navbar className="flex w-full px-8 py-2 items-center bg-zinc-100 shadow fixed h-14 z-20 whitespace-nowrap overflow-x-none overflow-y-hidden">
       <Link to="/" className="flex items-center hover:no-underline ">
         <div className="select-none text-lg font-bold leading-none">
           MAA Copilot
@@ -48,8 +28,8 @@ export const AppLayout: FCC = ({ children }) => (
 
       <div className="w-[1px] bg-gray-200 ml-4 mr-2 my-0.5 flex self-stretch" />
 
-      <div className="sm:flex items-center hidden">
-        {LINKS.map((link) => (
+      <div className="md:flex items-center hidden">
+        {NAV_LINKS.map((link) => (
           <NavLink
             key={link.to}
             to={link.to}
@@ -66,7 +46,7 @@ export const AppLayout: FCC = ({ children }) => (
 
       <div className="flex-1" />
 
-      <div className="flex sm:gap-4 gap-3">
+      <div className="flex md:gap-4 gap-3">
         <NavExpandButton />
         <ThemeSwitchButton />
         <AccountManager />
diff --git a/src/links.tsx b/src/links.tsx
new file mode 100644
index 00000000..45e83715
--- /dev/null
+++ b/src/links.tsx
@@ -0,0 +1,70 @@
+import { Icon as BlueprintIcon, IconName } from '@blueprintjs/core'
+import simpleIconsGitHub from '@iconify/icons-simple-icons/github'
+import simpleIconsQQ from '@iconify/icons-simple-icons/tencentqq'
+import { Icon as IconifyIcon } from '@iconify/react'
+
+export const NAV_LINKS: {
+  to: string
+  label: string
+  icon: IconName
+}[] = [
+  {
+    to: '/',
+    label: '首页',
+    icon: 'home',
+  },
+  {
+    to: '/create',
+    label: '创建作业',
+    icon: 'add',
+  },
+  {
+    to: '/about',
+    label: '关于',
+    icon: 'info-sign',
+  },
+]
+
+export const SOCIAL_LINKS = [
+  {
+    icon: <BlueprintIcon icon="globe" className="mr-2" size={12} />,
+    href: 'https://maa.plus',
+    label: 'MAA 官网',
+  },
+  {
+    icon: <BlueprintIcon icon="edit" className="mr-2" size={12} />,
+    href: 'https://github.com/MaaAssistantArknights/maa-copilot-frontend/issues/new/choose',
+    label: '意见与反馈',
+  },
+  {
+    icon: (
+      <IconifyIcon icon={simpleIconsGitHub} className="mr-2" fontSize="12px" />
+    ),
+    href: 'https://github.com/MaaAssistantArknights/MaaAssistantArknights',
+    label: 'MAA GitHub Repo',
+  },
+  {
+    icon: (
+      <IconifyIcon icon={simpleIconsGitHub} className="mr-2" fontSize="12px" />
+    ),
+    href: 'https://github.com/MaaAssistantArknights/maa-copilot-frontend',
+    label: '前端 GitHub Repo',
+  },
+  {
+    icon: (
+      <IconifyIcon icon={simpleIconsGitHub} className="mr-2" fontSize="12px" />
+    ),
+    href: 'https://github.com/MaaAssistantArknights/MaaBackendCenter',
+    label: '后端 GitHub Repo',
+  },
+  {
+    icon: <IconifyIcon icon={simpleIconsQQ} className="mr-2" fontSize="12px" />,
+    href: 'https://jq.qq.com/?_wv=1027&k=ElimpMzQ',
+    label: '作业制作者交流群：1169188429',
+  },
+  {
+    icon: <IconifyIcon icon={simpleIconsQQ} className="mr-2" fontSize="12px" />,
+    href: 'https://ota.maa.plus/MaaAssistantArknights/api/qqgroup/index.html',
+    label: '作业分享群',
+  },
+]
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index dd4d3998..c96e8723 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,8 +1,6 @@
-import { Icon as BlueprintIcon, Card } from '@blueprintjs/core'
-import simpleIconsGitHub from '@iconify/icons-simple-icons/github'
-import simpleIconsQQ from '@iconify/icons-simple-icons/tencentqq'
-import { Icon as IconifyIcon } from '@iconify/react'
+import { Card } from '@blueprintjs/core'
 
+import dayjs from 'dayjs'
 import { ComponentType } from 'react'
 
 import { CardTitle } from 'components/CardTitle'
@@ -14,94 +12,76 @@ import { OperationSetEditorLauncher } from 'components/operation-set/OperationSe
 import { OperationUploaderLauncher } from 'components/uploader/OperationUploaderLauncher'
 
 import { AnnPanel } from '../components/announcement/AnnPanel'
-
-const SOCIAL_LINKS = [
-  {
-    icon: <BlueprintIcon icon="globe" className="mr-2" size={12} />,
-    href: 'https://maa.plus',
-    label: 'MAA 官网',
-  },
-  {
-    icon: <BlueprintIcon icon="edit" className="mr-2" size={12} />,
-    href: 'https://github.com/MaaAssistantArknights/maa-copilot-frontend/issues/new/choose',
-    label: '意见与反馈',
-  },
-  {
-    icon: (
-      <IconifyIcon icon={simpleIconsGitHub} className="mr-2" fontSize="12px" />
-    ),
-    href: 'https://github.com/MaaAssistantArknights/MaaAssistantArknights',
-    label: 'MAA GitHub Repo',
-  },
-  {
-    icon: (
-      <IconifyIcon icon={simpleIconsGitHub} className="mr-2" fontSize="12px" />
-    ),
-    href: 'https://github.com/MaaAssistantArknights/maa-copilot-frontend',
-    label: '前端 GitHub Repo',
-  },
-  {
-    icon: (
-      <IconifyIcon icon={simpleIconsGitHub} className="mr-2" fontSize="12px" />
-    ),
-    href: 'https://github.com/MaaAssistantArknights/MaaBackendCenter',
-    label: '后端 GitHub Repo',
-  },
-  {
-    icon: <IconifyIcon icon={simpleIconsQQ} className="mr-2" fontSize="12px" />,
-    href: 'https://jq.qq.com/?_wv=1027&k=ElimpMzQ',
-    label: '作业制作者交流群：1169188429',
-  },
-  {
-    icon: <IconifyIcon icon={simpleIconsQQ} className="mr-2" fontSize="12px" />,
-    href: 'https://ota.maa.plus/MaaAssistantArknights/api/qqgroup/index.html',
-    label: '作业分享群',
-  },
-]
+import { SOCIAL_LINKS } from '../links'
+import { useCurrentSize } from '../utils/useCurrenSize'
 
 export const IndexPage: ComponentType = withGlobalErrorBoundary(() => {
+  const { isMD } = useCurrentSize()
   return (
-    <div className="flex flex-col md:flex-row px-8 mt-8 max-w-[96rem] mx-auto">
-      <div className="md:w-2/3 order-2 md:order-1 mr-0 md:mr-8">
+    <div className="flex flex-col md:flex-row px-4 mt-4 md:px-8 md:mt-8 max-w-[96rem] mx-auto">
+      {isMD && <Ads />}
+      <div className="md:w-2/3 order-2 md:order-1 mr-0 md:mr-8 mt-4 md:mt-0">
         <Operations />
       </div>
-      <div className="md:w-1/3 order-1 md:order-2">
-        <div className="sticky top-20">
-          <Card className="flex flex-col mb-4 space-y-2">
-            <CardTitle icon="add" className="mb-4">
-              创建新作业
-            </CardTitle>
+      {!isMD && (
+        <div className="md:w-1/3 order-1 md:order-2">
+          <div className="sticky top-20">
+            <Card className="flex flex-col mb-4 space-y-2">
+              <CardTitle icon="add" className="mb-4">
+                创建新作业
+              </CardTitle>
+
+              <OperationEditorLauncher />
+              <OperationUploaderLauncher />
+              <OperationSetEditorLauncher />
+            </Card>
 
-            <OperationEditorLauncher />
-            <OperationUploaderLauncher />
-            <OperationSetEditorLauncher />
-          </Card>
+            <AnnPanel className="mb-4" />
 
-          <AnnPanel className="mb-4" />
+            <div className="flex flex-wrap leading-relaxed mb-4 section-social-links">
+              {SOCIAL_LINKS.map((link) => (
+                <a
+                  href={link.href}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="flex items-center text-zinc-600 dark:text-slate-100 no-underline"
+                >
+                  {link.icon}
+                  <span>{link.label}</span>
+                </a>
+              )).reduce((prev, curr) => (
+                <>
+                  {prev}
+                  <div className="mx-2 opacity-50">·</div>
+                  {curr}
+                </>
+              ))}
+            </div>
 
-          <div className="flex flex-wrap leading-relaxed mb-8 section-social-links">
-            {SOCIAL_LINKS.map((link) => (
-              <a
-                href={link.href}
-                target="_blank"
-                rel="noopener noreferrer"
-                className="flex items-center text-zinc-600 dark:text-slate-100 no-underline"
-              >
-                {link.icon}
-                <span>{link.label}</span>
-              </a>
-            )).reduce((prev, curr) => (
-              <>
-                {prev}
-                <div className="mx-2 opacity-50">·</div>
-                {curr}
-              </>
-            ))}
+            <Ads />
           </div>
         </div>
-      </div>
+      )}
 
       <OperationDrawer />
     </div>
   )
 })
+
+const Ads =
+  dayjs().isAfter('2025-03-02 00:00:00+8') &&
+  dayjs().isBefore('2025-04-02 00:00:00+8')
+    ? () => (
+        // eslint-disable-next-line react/jsx-no-target-blank
+        <a
+          className="block relative"
+          href="https://gad.netease.com/gad/access?project_id=201005304&s=SppRGFTnJ1VxfSFEZWE6hY3pO4gn&code_type=1"
+          target="_blank"
+        >
+          <img src="/ads_mumu.jpg" alt="MuMu模拟器" />
+          <div className="absolute bottom-2 right-2 border border-current rounded text-[10px] text-zinc-300 px-1">
+            广告
+          </div>
+        </a>
+      )
+    : () => null
diff --git a/src/store/nav.ts b/src/store/nav.ts
index 6d0b2625..3e7ecd37 100644
--- a/src/store/nav.ts
+++ b/src/store/nav.ts
@@ -8,7 +8,7 @@ export const navAtom = atom<NavState>({
   expanded: false,
 })
 
-export const toggleExpandNavAtom = atom(null, (get, set, value) => {
+export const toggleExpandNavAtom = atom(null, (get, set, value: void) => {
   set(navAtom, {
     ...get(navAtom),
     expanded: !get(navAtom).expanded,
diff --git a/src/utils/useCurrenSize.ts b/src/utils/useCurrenSize.ts
index a0ac2d66..32116119 100644
--- a/src/utils/useCurrenSize.ts
+++ b/src/utils/useCurrenSize.ts
@@ -5,11 +5,14 @@ import { useWindowSize } from 'react-use'
 export const useCurrentSize = () => {
   const { width } = useWindowSize()
 
-  const isSM = useMemo(() => width < 640, [width])
-  const isMD = useMemo(() => width >= 640 && width < 768, [width])
-  const isLG = useMemo(() => width >= 768 && width < 1024, [width])
-  const isXL = useMemo(() => width >= 1024 && width < 1280, [width])
-  const is2XL = useMemo(() => width >= 1280 && width < 1536, [width])
-
-  return { isSM, isMD, isLG, isXL, is2XL }
+  return useMemo(
+    () => ({
+      isSM: width < 640,
+      isMD: width < 768,
+      isLG: width < 1024,
+      isXL: width < 1280,
+      is2XL: width < 1536,
+    }),
+    [width],
+  )
 }