Skip to content
This repository was archived by the owner on Sep 30, 2024. It is now read-only.

Commit 90e09e5

Browse files
committed
chore: update docs
1 parent c587f59 commit 90e09e5

File tree

2 files changed

+142
-120
lines changed

2 files changed

+142
-120
lines changed
Lines changed: 119 additions & 120 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,19 @@
11
<template>
2-
<div class="theme" :class="pageClasses">
3-
<NavBar v-if="showNavbar" @toggle="toggleSidebar">
2+
<V5 />
3+
<div
4+
class="theme"
5+
:class="pageClasses"
6+
:style="{
7+
paddingTop: '60px',
8+
}"
9+
>
10+
<NavBar
11+
v-if="showNavbar"
12+
@toggle="toggleSidebar"
13+
:style="{
14+
top: '60px',
15+
}"
16+
>
417
<template #search>
518
<slot name="navbar-search">
619
<AlgoliaSearchBox
@@ -41,10 +54,7 @@
4154
<Page v-else>
4255
<template #top>
4356
<slot name="page-top-ads">
44-
<div
45-
id="ads-container"
46-
v-if="theme.carbonAds && theme.carbonAds.carbon"
47-
>
57+
<div id="ads-container" v-if="theme.carbonAds && theme.carbonAds.carbon">
4858
<CarbonAds
4959
:key="'carbon' + page.relativePath"
5060
:code="theme.carbonAds.carbon"
@@ -72,129 +82,118 @@
7282
</template>
7383

7484
<script setup lang="ts">
75-
import { ref, computed, watch, defineAsyncComponent } from 'vue'
76-
import {
77-
useRoute,
78-
useSiteData,
79-
usePageData,
80-
useSiteDataByRoute
81-
} from 'vitepress'
82-
import { isSideBarEmpty, getSideBarConfig } from './support/sideBar'
83-
import type { DefaultTheme } from './config'
84-
85-
// components
86-
import NavBar from './components/NavBar.vue'
87-
import SideBar from './components/SideBar.vue'
88-
import Page from './components/Page.vue'
89-
90-
const Home = defineAsyncComponent(() => import('./components/Home.vue'))
91-
92-
const NoopComponent = () => null
93-
94-
const CarbonAds = __CARBON__
95-
? defineAsyncComponent(() => import('./components/CarbonAds.vue'))
96-
: NoopComponent
97-
const BuySellAds = __BSA__
98-
? defineAsyncComponent(() => import('./components/BuySellAds.vue'))
99-
: NoopComponent
100-
const AlgoliaSearchBox = __ALGOLIA__
101-
? defineAsyncComponent(() => import('./components/AlgoliaSearchBox.vue'))
102-
: NoopComponent
103-
104-
// generic state
105-
const route = useRoute()
106-
const siteData = useSiteData<DefaultTheme.Config>()
107-
const siteRouteData = useSiteDataByRoute()
108-
const theme = computed(() => siteData.value.themeConfig)
109-
const page = usePageData()
110-
111-
// custom layout
112-
const isCustomLayout = computed(() => !!route.data.frontmatter.customLayout)
113-
// home
114-
const enableHome = computed(() => !!route.data.frontmatter.home)
115-
116-
// navbar
117-
const showNavbar = computed(() => {
118-
const { themeConfig } = siteRouteData.value
119-
const { frontmatter } = route.data
120-
if (frontmatter.navbar === false || themeConfig.navbar === false) {
121-
return false
122-
}
123-
return (
124-
siteData.value.title ||
125-
themeConfig.logo ||
126-
themeConfig.repo ||
127-
themeConfig.nav
128-
)
129-
})
130-
131-
// sidebar
132-
const openSideBar = ref(false)
133-
134-
const showSidebar = computed(() => {
135-
const { frontmatter } = route.data
136-
137-
if (frontmatter.home || frontmatter.sidebar === false) {
138-
return false
139-
}
85+
import V5 from './V5.vue';
86+
import { ref, computed, watch, defineAsyncComponent } from 'vue';
87+
import { useRoute, useSiteData, usePageData, useSiteDataByRoute } from 'vitepress';
88+
import { isSideBarEmpty, getSideBarConfig } from './support/sideBar';
89+
import type { DefaultTheme } from './config';
90+
91+
// components
92+
import NavBar from './components/NavBar.vue';
93+
import SideBar from './components/SideBar.vue';
94+
import Page from './components/Page.vue';
95+
96+
const Home = defineAsyncComponent(() => import('./components/Home.vue'));
97+
98+
const NoopComponent = () => null;
99+
100+
const CarbonAds = __CARBON__
101+
? defineAsyncComponent(() => import('./components/CarbonAds.vue'))
102+
: NoopComponent;
103+
const BuySellAds = __BSA__
104+
? defineAsyncComponent(() => import('./components/BuySellAds.vue'))
105+
: NoopComponent;
106+
const AlgoliaSearchBox = __ALGOLIA__
107+
? defineAsyncComponent(() => import('./components/AlgoliaSearchBox.vue'))
108+
: NoopComponent;
109+
110+
// generic state
111+
const route = useRoute();
112+
const siteData = useSiteData<DefaultTheme.Config>();
113+
const siteRouteData = useSiteDataByRoute();
114+
const theme = computed(() => siteData.value.themeConfig);
115+
const page = usePageData();
116+
117+
// custom layout
118+
const isCustomLayout = computed(() => !!route.data.frontmatter.customLayout);
119+
// home
120+
const enableHome = computed(() => !!route.data.frontmatter.home);
121+
122+
// navbar
123+
const showNavbar = computed(() => {
124+
const { themeConfig } = siteRouteData.value;
125+
const { frontmatter } = route.data;
126+
if (frontmatter.navbar === false || themeConfig.navbar === false) {
127+
return false;
128+
}
129+
return siteData.value.title || themeConfig.logo || themeConfig.repo || themeConfig.nav;
130+
});
131+
132+
// sidebar
133+
const openSideBar = ref(false);
140134
141-
const { themeConfig } = siteRouteData.value
142-
143-
return !isSideBarEmpty(
144-
getSideBarConfig(themeConfig.sidebar, route.data.relativePath)
145-
)
146-
})
147-
148-
const toggleSidebar = (to?: boolean) => {
149-
openSideBar.value = typeof to === 'boolean' ? to : !openSideBar.value
150-
}
151-
152-
const hideSidebar = toggleSidebar.bind(null, false)
153-
// close the sidebar when navigating to a different location
154-
watch(route, hideSidebar)
155-
// TODO: route only changes when the pathname changes
156-
// listening to hashchange does nothing because it's prevented in router
157-
158-
// page classes
159-
const pageClasses = computed(() => {
160-
return [
161-
{
162-
'no-navbar': !showNavbar.value,
163-
'sidebar-open': openSideBar.value,
164-
'no-sidebar': !showSidebar.value
135+
const showSidebar = computed(() => {
136+
const { frontmatter } = route.data;
137+
138+
if (frontmatter.home || frontmatter.sidebar === false) {
139+
return false;
165140
}
166-
]
167-
})
141+
142+
const { themeConfig } = siteRouteData.value;
143+
144+
return !isSideBarEmpty(getSideBarConfig(themeConfig.sidebar, route.data.relativePath));
145+
});
146+
147+
const toggleSidebar = (to?: boolean) => {
148+
openSideBar.value = typeof to === 'boolean' ? to : !openSideBar.value;
149+
};
150+
151+
const hideSidebar = toggleSidebar.bind(null, false);
152+
// close the sidebar when navigating to a different location
153+
watch(route, hideSidebar);
154+
// TODO: route only changes when the pathname changes
155+
// listening to hashchange does nothing because it's prevented in router
156+
157+
// page classes
158+
const pageClasses = computed(() => {
159+
return [
160+
{
161+
'no-navbar': !showNavbar.value,
162+
'sidebar-open': openSideBar.value,
163+
'no-sidebar': !showSidebar.value,
164+
},
165+
];
166+
});
168167
</script>
169168

170169
<style>
171-
#ads-container {
172-
margin: 0 auto;
173-
}
174-
175-
@media (min-width: 420px) {
176170
#ads-container {
177-
position: relative;
178-
right: 0;
179-
float: right;
180-
margin: -8px -8px 24px 24px;
181-
width: 146px;
171+
margin: 0 auto;
182172
}
183-
}
184173
185-
@media (max-width: 420px) {
186-
#ads-container {
187-
/* Avoid layout shift */
188-
height: 105px;
189-
margin: 1.75rem 0;
174+
@media (min-width: 420px) {
175+
#ads-container {
176+
position: relative;
177+
right: 0;
178+
float: right;
179+
margin: -8px -8px 24px 24px;
180+
width: 146px;
181+
}
190182
}
191-
}
192183
193-
@media (min-width: 1400px) {
194-
#ads-container {
195-
position: fixed;
196-
right: 8px;
197-
bottom: 8px;
184+
@media (max-width: 420px) {
185+
#ads-container {
186+
/* Avoid layout shift */
187+
height: 105px;
188+
margin: 1.75rem 0;
189+
}
190+
}
191+
192+
@media (min-width: 1400px) {
193+
#ads-container {
194+
position: fixed;
195+
right: 8px;
196+
bottom: 8px;
197+
}
198198
}
199-
}
200199
</style>

.vitepress/theme-default/V5.vue

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<template>
2+
<div class="vben-v5">
3+
你正在查看的是 2.0 版本文档,当前最新版本为 v5.0,预览地址为
4+
<a href="https://vben.pro" target="_blank">预览地址</a>。 如果你想要查看新版本文档,请点击
5+
<a href="https://doc.vben.pro/" target="_blank"> V5 文档 </a> 查看最新文档。
6+
</div>
7+
</template>
8+
9+
<style scoped>
10+
.vben-v5 {
11+
position: fixed;
12+
height: 60px;
13+
z-index: 1000;
14+
top: 0;
15+
left: 0;
16+
background: rgb(246, 197, 20);
17+
width: 100%;
18+
display: flex;
19+
justify-content: center;
20+
align-items: center;
21+
color: #333;
22+
}
23+
</style>

0 commit comments

Comments
 (0)