返回 slidev
Layout.vue
根目录 / docs / .vitepress / theme / components / Layout.vue
1 <script setup lang="ts">
2 import { Dropdown } from 'floating-vue'
3 import { useRoute } from 'vitepress'
4 import VPMenuLink from 'vitepress/dist/client/theme-default/components/VPMenuLink.vue'
5 import DefaultTheme from 'vitepress/theme'
6 import FeatureTag from './FeatureTag.vue'
7
8 const { Layout } = DefaultTheme
9 const route = useRoute()
10 </script>
11
12 <template>
13 <Layout>
14 <template #nav-bar-title-after>
15 <a @click.prevent>
16 <Dropdown :triggers="['hover', 'click']" :popper-triggers="['hover']" theme="twoslash" popper-class="z-1000">
17 <Badge class="scale-80 translate-x--1 select-none">
18 New Docs!
19 </Badge>
20 <template #popper>
21 <div class="p3 text-sm">
22 <p>
23 You are viewing the new Slidev documentation.
24 </p>
25 <p>
26 The old one is available
27 <a href="https://docs-legacy.sli.dev/" class="underline text-primary" target="_blank">here</a>.
28 </p>
29 </div>
30 </template>
31 </Dropdown>
32 </a>
33 </template>
34 <template #sidebar-nav-after>
35 <div flex="~ col gap-2">
36 <div v-if="route.data?.frontmatter?.tags" class="bg-$vp-c-bg-soft p4 rounded-lg" flex="~ col gap-2">
37 <div font-bold text-sm op75>
38 Tags
39 </div>
40 <div flex="~ wrap gap-2">
41 <FeatureTag v-for="tag in route.data.frontmatter.tags" :key="tag" :tag="tag" />
42 </div>
43 </div>
44 <div v-if="route.data?.frontmatter?.since" class="bg-$vp-c-bg-soft px2 pb2 rounded-lg" flex="~ col gap-1">
45 <div font-bold text-sm op75 px2 pt4>
46 Since
47 </div>
48 <VPMenuLink
49 :item="{
50 text: route.data.frontmatter.since,
51 link: `https://github.com/slidevjs/slidev/releases/tag/${route.data.frontmatter.since}`,
52 }"
53 />
54 </div>
55 </div>
56 </template>
57 </Layout>
58 </template>
59
59 lines Plain Text