diff --git a/.vscode/settings.json b/.vscode/settings.json
index e2c21937..db26feff 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -22,6 +22,7 @@
"commitlint",
"composables",
"Docsearch",
+ "gsap",
"nprogress",
"pnpm",
"tsbuildinfo",
diff --git a/docs/.vuepress/config.ts b/docs/.vuepress/config.ts
index 267ea0a1..91edf65e 100644
--- a/docs/.vuepress/config.ts
+++ b/docs/.vuepress/config.ts
@@ -9,6 +9,7 @@ export default defineUserConfig({
lang: 'zh',
title: 'Plume Theme',
description: '',
+ source: path.resolve(__dirname, '../'),
public: path.resolve(__dirname, 'public'),
bundler:
diff --git a/docs/notes/面试题/README.md b/docs/notes/面试题/README.md
index 6068b41c..7f25285c 100644
--- a/docs/notes/面试题/README.md
+++ b/docs/notes/面试题/README.md
@@ -20,3 +20,37 @@ permalink: /note/interview-question/
如果你发现本笔记中有哪些错误,欢迎指出,我将虚心受教!
:::
+
+1
+
+1
+
+1
+
+
+1
+
+
+11
+
+
+1
+
+1
+
+
+1
+
+1
+
+1
+
+1
+
+1
+
+1
+
+1
+
+1
diff --git a/packages/plugin-caniuse/package.json b/packages/plugin-caniuse/package.json
index 0e990568..848c164d 100644
--- a/packages/plugin-caniuse/package.json
+++ b/packages/plugin-caniuse/package.json
@@ -30,6 +30,9 @@
"@vuepress/utils": "2.0.0-beta.41",
"markdown-it-container": "^3.0.0"
},
+ "devDependencies": {
+ "@types/markdown-it": "^12.2.3"
+ },
"publishConfig": {
"access": "public"
}
diff --git a/packages/theme/src/client/components/AsideNavbar.vue b/packages/theme/src/client/components/AsideNavbar.vue
new file mode 100644
index 00000000..b5e9aba5
--- /dev/null
+++ b/packages/theme/src/client/components/AsideNavbar.vue
@@ -0,0 +1,45 @@
+
+
+
+
+
+
+
+
+
diff --git a/packages/theme/src/client/components/Navbar.vue b/packages/theme/src/client/components/Navbar.vue
index 06404ce2..cdda1bbf 100644
--- a/packages/theme/src/client/components/Navbar.vue
+++ b/packages/theme/src/client/components/Navbar.vue
@@ -4,13 +4,13 @@ import NavbarBrand from '@theme-plume/NavbarBrand.vue'
import NavbarItems from '@theme-plume/NavbarItems.vue'
import ToggleSidebarButton from '@theme-plume/ToggleSidebarButton.vue'
import { computed, onMounted, ref } from 'vue'
-import { useThemeLocaleData } from '../composables'
+import { useAsideNavbar, useThemeLocaleData } from '../composables'
import { getCssValue } from '../utils'
-defineEmits(['toggle-sidebar'])
-
const themeLocale = useThemeLocaleData()
+const { triggerAsideNavbar } = useAsideNavbar()
+
const navbar = ref(null)
const navbarBrand = ref(null)
@@ -47,7 +47,7 @@ onMounted(() => {
-
+
@@ -69,11 +69,12 @@ onMounted(() => {
position: fixed;
top: 0;
left: 0;
+ right: 0;
z-index: 10;
display: flex;
justify-content: space-between;
align-items: center;
- width: 100%;
+ width: 100v;
height: var(--navbar-height);
padding: var(--navbar-padding-v) var(--navbar-padding-h);
background-color: var(--c-bg-navbar);
diff --git a/packages/theme/src/client/components/PostList.vue b/packages/theme/src/client/components/PostList.vue
index aedf929f..e71b94bc 100644
--- a/packages/theme/src/client/components/PostList.vue
+++ b/packages/theme/src/client/components/PostList.vue
@@ -3,11 +3,12 @@ import DropdownTransition from '@theme-plume/DropdownTransition.vue'
import PostItem from '@theme-plume/PostItem.vue'
import { usePageFrontmatter } from '@vuepress/client'
import type { PropType } from 'vue'
-import { onMounted, toRefs, watch } from 'vue'
+import { toRefs, watch } from 'vue'
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router'
import type { PlumeThemeHomeFrontmatter } from '../../shared'
import type { PostListData } from '../composables'
import { usePostList } from '../composables'
+import { scrollTo } from '../utils'
import Pagination from './Pagination.vue'
const props = defineProps({
@@ -30,6 +31,7 @@ watch(
},
{ immediate: true }
)
+
const route = useRoute()
onBeforeRouteUpdate((to) => {
@@ -42,7 +44,7 @@ onBeforeRouteUpdate((to) => {
rect || document.querySelector('.navbar-wrapper')?.getBoundingClientRect()
top = document.documentElement.clientHeight - (rect?.height || 0)
}
- document.documentElement.scrollTop = top
+ scrollTo(document, top)
})
setPostListPage((route.query.p as unknown as number) || 1)
diff --git a/packages/theme/src/client/components/Sidebar.vue b/packages/theme/src/client/components/Sidebar.vue
index 55fa10fe..ed423548 100644
--- a/packages/theme/src/client/components/Sidebar.vue
+++ b/packages/theme/src/client/components/Sidebar.vue
@@ -1,21 +1,36 @@
diff --git a/packages/theme/src/client/components/SidebarItems.vue b/packages/theme/src/client/components/SidebarItems.vue
index 9ebe3703..4af83197 100644
--- a/packages/theme/src/client/components/SidebarItems.vue
+++ b/packages/theme/src/client/components/SidebarItems.vue
@@ -64,13 +64,13 @@ const sidebarClick = (sidebar: SidebarListComputed): void => {
{{ sidebar.text }}
{
}
.tag-list {
+ width: 100%;
padding: 0 1.25rem 0.75rem;
margin: 0 -0.25rem;
diff --git a/packages/theme/src/client/components/Toc.ts b/packages/theme/src/client/components/Toc.ts
index bf2ffeac..eab2089a 100644
--- a/packages/theme/src/client/components/Toc.ts
+++ b/packages/theme/src/client/components/Toc.ts
@@ -4,6 +4,7 @@ import type { PropType, VNode } from 'vue'
import { computed, defineComponent, h, toRefs } from 'vue'
import type { RouteLocationNormalizedLoaded } from 'vue-router'
import { useRoute } from 'vue-router'
+import { scrollTo } from '../utils'
export type TocPropsHeaders = PageHeader[]
@@ -51,7 +52,7 @@ const renderLink = (
if (!anchor) return
const el = document.documentElement
const top = anchor.getBoundingClientRect().top - 80 + el.scrollTop
- el.scrollTo ? el.scrollTo({ top }) : (el.scrollTop = top)
+ scrollTo(document, top)
}
return h(
diff --git a/packages/theme/src/client/composables/asideNavbar.ts b/packages/theme/src/client/composables/asideNavbar.ts
new file mode 100644
index 00000000..368e9d65
--- /dev/null
+++ b/packages/theme/src/client/composables/asideNavbar.ts
@@ -0,0 +1,23 @@
+import type { Ref } from 'vue'
+import { ref } from 'vue'
+
+const asideNavbarShow = ref(false)
+
+const triggerAsideNavbar = (show?: boolean): void => {
+ if (typeof show === 'boolean') {
+ asideNavbarShow.value = show
+ } else {
+ asideNavbarShow.value = !asideNavbarShow.value
+ }
+}
+
+interface UseAsideNavbar {
+ asideNavbarShow: Ref
+ triggerAsideNavbar: (show?: boolean) => void
+}
+export const useAsideNavbar = (): UseAsideNavbar => {
+ return {
+ asideNavbarShow,
+ triggerAsideNavbar,
+ }
+}
diff --git a/packages/theme/src/client/composables/index.ts b/packages/theme/src/client/composables/index.ts
index 5661da0c..45efb0f6 100644
--- a/packages/theme/src/client/composables/index.ts
+++ b/packages/theme/src/client/composables/index.ts
@@ -8,6 +8,7 @@ export * from './postIndex'
export * from './sidebarIndex'
export * from './postList'
export * from './scrollPromise'
+export * from './asideNavbar'
export * from './tag'
export * from './category'
diff --git a/packages/theme/src/client/composables/sidebarIndex.ts b/packages/theme/src/client/composables/sidebarIndex.ts
index 62f00eb2..a7dac6cc 100644
--- a/packages/theme/src/client/composables/sidebarIndex.ts
+++ b/packages/theme/src/client/composables/sidebarIndex.ts
@@ -28,6 +28,8 @@ export const useSidebarIndex = (): UseSidebarIndex => {
sidebarList.value = sidebarIndex.value[key]
}
})
+ } else {
+ sidebarList.value = []
}
}
return { sidebarList, initSidebarList }
diff --git a/packages/theme/src/client/layouts/Layout.vue b/packages/theme/src/client/layouts/Layout.vue
index 35c26e36..aabeec75 100644
--- a/packages/theme/src/client/layouts/Layout.vue
+++ b/packages/theme/src/client/layouts/Layout.vue
@@ -1,5 +1,6 @@