From e274353968c9f4b67d442997978a0b66f75bd296 Mon Sep 17 00:00:00 2001 From: zthxxx Date: Mon, 26 Jun 2023 22:37:00 +0800 Subject: [PATCH 1/2] docs: support zoom with specify images in docs --- .vscode/settings.json | 3 +++ docs/.vitepress/theme/index.ts | 34 ++++++++++++++++++++++++++++++++- docs/.vitepress/theme/style.css | 11 +++++++++++ docs/config/rss.md | 4 ++-- docs/deploy/dsm.md | 6 +++--- docs/home/index.md | 8 +++++++- docs/package.json | 1 + docs/pnpm-lock.yaml | 7 +++++++ 8 files changed, 67 insertions(+), 7 deletions(-) diff --git a/.vscode/settings.json b/.vscode/settings.json index 01799125..28838c61 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -6,5 +6,8 @@ "tsconfig.json": "json5", "tsconfig.*.json": "json5", }, + "[markdown]": { + "editor.wordWrap": "off", + }, "python.venvPath": "./backend/venv", } diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts index bdd506d9..00f58d72 100644 --- a/docs/.vitepress/theme/index.ts +++ b/docs/.vitepress/theme/index.ts @@ -1,15 +1,47 @@ // https://vitepress.dev/guide/custom-theme -import { h } from 'vue' +import { + h, + onMounted, + watch, + nextTick, +} from 'vue' import Theme from 'vitepress/theme' +import { useRoute } from 'vitepress' +import mediumZoom from 'medium-zoom' + import './style.css' export default { extends: Theme, + themeConfig: { + search: { + provider: 'local' + } + }, Layout: () => { return h(Theme.Layout, null, { // https://vitepress.dev/guide/extending-default-theme#layout-slots }) }, + setup() { + const route = useRoute() + const initZoom = () => { + /** + * Allow images to be zoomed in on click + * https://github.com/vuejs/vitepress/issues/854 + */ + mediumZoom('[data-zoomable]', { background: 'var(--vp-c-bg)' }) + } + + onMounted(() => { + initZoom() + }) + + watch( + () => route.path, + () => nextTick(initZoom), + ) + }, enhanceApp({ app, router, siteData }) { // ... } diff --git a/docs/.vitepress/theme/style.css b/docs/.vitepress/theme/style.css index c23c17ac..d2bb3285 100644 --- a/docs/.vitepress/theme/style.css +++ b/docs/.vitepress/theme/style.css @@ -89,3 +89,14 @@ --docsearch-primary-color: var(--vp-c-brand) !important; } +/** + * Component: medium-zoom + * -------------------------------------------------------------------------- */ + +.medium-zoom-overlay { + z-index: 20; +} + +.medium-zoom-image { + z-index: 21; +} diff --git a/docs/config/rss.md b/docs/config/rss.md index 3914a0d3..f8de2400 100644 --- a/docs/config/rss.md +++ b/docs/config/rss.md @@ -11,7 +11,7 @@ AutoBangumi 可以自动解析 [Mikan Project][mikan-site] 的 RSS 订阅地址 本项目基于解析 Mikan Project 提供的 RSS 地址，因此如果要实现自动追番，需要注册并且获得 Mikan Project 的 RSS 地址： -![image](../image/rss/rss-token.png) +![image](../image/rss/rss-token.png){data-zoomable} 获取的 RSS 地址如下： @@ -27,7 +27,7 @@ AB 中需要填入的 `token` 为以上 url 中 `token=` 后面的一串字符 由于 AutoBangumi 会解析所有获得的 RSS 信息，因此在订阅番剧的时候需要注意以下几点： -![image](../image/rss/advanced-subscription.png) +![image](../image/rss/advanced-subscription.png){data-zoomable} - 在个人设置中打开高级设置。 - 一部番剧只订阅一个字幕组，点击 Mikan Project 的番剧图片即可呼出二级菜单，选择一个字幕组订阅即可。 diff --git a/docs/deploy/dsm.md b/docs/deploy/dsm.md index e7fa14ac..b5e11993 100644 --- a/docs/deploy/dsm.md +++ b/docs/deploy/dsm.md @@ -9,13 +9,13 @@ 进入套件中心，安装 Container Manager (Docker) 套件。 -![install-docker](../image/dsm/install-docker.png) +![install-docker](../image/dsm/install-docker.png){data-zoomable} ## 通过 Docker compose 安装配置 AB 点击 **项目**，然后点击 **新建**，选择 **Docker Compose**。 -![new-compose](../image/dsm/new-compose.png) +![new-compose](../image/dsm/new-compose.png){data-zoomable} 复制以下内容填入 **Docker Compose** 中。 ```yaml @@ -36,7 +36,7 @@ services: 点击 **下一步**，然后点击 **完成**。 -![create](../image/dsm/create.png) +![create](../image/dsm/create.png){data-zoomable} 完成创建之后进入 `http://:7892` 即可进入 AB 并进行配置。 diff --git a/docs/home/index.md b/docs/home/index.md index e8f3021e..38810344 100644 --- a/docs/home/index.md +++ b/docs/home/index.md @@ -11,7 +11,13 @@

- + AutoBangumi WebUI

本项目是基于 [Mikan Project](https://mikanani.me)、[qBittorrent](https://qbittorrent.org) 的全自动追番整理下载工具。只需要在 [Mikan Project](https://mikanani.me) 上订阅番剧，就可以全自动追番。并且整理完成的名称和目录可以直接被 [Plex]()、[Jellyfin]() 等媒体库软件识别，无需二次刮削。 diff --git a/docs/package.json b/docs/package.json index 883484bb..0715dcfc 100644 --- a/docs/package.json +++ b/docs/package.json @@ -7,6 +7,7 @@ "deploy:preview": "vercel --cwd .vitepress/dist" }, "devDependencies": { + "medium-zoom": "^1.0.8", "typescript": "4.9.5", "vercel": "31.0.1", "vitepress": "1.0.0-beta.3", diff --git a/docs/pnpm-lock.yaml b/docs/pnpm-lock.yaml index b958b298..9c0106bf 100644 --- a/docs/pnpm-lock.yaml +++ b/docs/pnpm-lock.yaml @@ -1,6 +1,9 @@ lockfileVersion: '6.0' devDependencies: + medium-zoom: + specifier: ^1.0.8 + version: 1.0.8 typescript: specifier: 4.9.5 version: 4.9.5 @@ -4922,6 +4925,10 @@ packages: engines: {node: '>= 0.6'} dev: true + /medium-zoom@1.0.8: + resolution: {integrity: sha512-CjFVuFq/IfrdqesAXfg+hzlDKu6A2n80ZIq0Kl9kWjoHh9j1N9Uvk5X0/MmN0hOfm5F9YBswlClhcwnmtwz7gA==} + dev: true + /merge-descriptors@1.0.1: resolution: {integrity: sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w==} dev: true From 273e6c6595e47a6aff2c48c7dd2d5fc0155e364f Mon Sep 17 00:00:00 2001 From: zthxxx Date: Mon, 26 Jun 2023 22:53:00 +0800 Subject: [PATCH 2/2] fix(docs): fix support of Search Bar in docs --- docs/.vitepress/config.ts | 4 ++++ docs/.vitepress/theme/index.ts | 5 ----- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index 68dd5908..16d33395 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -13,6 +13,10 @@ export default defineConfig({ { text: "常见问题", link: "/faq/常见问题" }, ], + search: { + provider: 'local' + }, + sidebar: [ { text: "项目说明", diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts index 00f58d72..8d59f65d 100644 --- a/docs/.vitepress/theme/index.ts +++ b/docs/.vitepress/theme/index.ts @@ -13,11 +13,6 @@ import './style.css' export default { extends: Theme, - themeConfig: { - search: { - provider: 'local' - } - }, Layout: () => { return h(Theme.Layout, null, { // https://vitepress.dev/guide/extending-default-theme#layout-slots