98 lines
2.5 KiB
Vue
98 lines
2.5 KiB
Vue
<template>
|
|
<Layout :class="headerClass">
|
|
<template #layout-top>
|
|
<Alert
|
|
v-if="alert"
|
|
:key="alertKey"
|
|
:content="alert.content"
|
|
:closeable="alert.closeable"
|
|
:type="alert.type"
|
|
/>
|
|
</template>
|
|
|
|
<template #sidebar-nav-after>
|
|
<div
|
|
v-if="sidebarEnder !== false"
|
|
class="sidebar-end"
|
|
>
|
|
<VPSideBarItem
|
|
:depth="0"
|
|
:item="sidebarEnder"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<template #doc-before>
|
|
<div
|
|
v-if="header !== ''"
|
|
class="collection-header"
|
|
>
|
|
<PostHeader v-if="header === 'post'" />
|
|
<CollectionHeader v-else />
|
|
</div>
|
|
</template>
|
|
|
|
<template #aside-ads-before>
|
|
<Tags :key="tagsKey" />
|
|
<Jobs :key="jobsKey" />
|
|
<Sponsors :key="sponsorsKey" />
|
|
</template>
|
|
|
|
<template #doc-footer-before>
|
|
<Tags
|
|
v-if="header === 'post'"
|
|
:key="tagsKey"
|
|
/>
|
|
<div
|
|
v-if="mailchimp"
|
|
class="newsletter-wrapper"
|
|
>
|
|
<MailChimp v-bind="mailchimp" />
|
|
</div>
|
|
</template>
|
|
</Layout>
|
|
</template>
|
|
|
|
<script setup>
|
|
import {useData} from 'vitepress';
|
|
import {computed, ref, watch} from 'vue';
|
|
|
|
import DefaultTheme from 'vitepress/theme';
|
|
import VPSideBarItem from 'vitepress/dist/client/theme-default/components/VPSidebarItem.vue';
|
|
|
|
import Alert from './VPLAlert.vue';
|
|
import CollectionHeader from './VPLCollectionHeader.vue';
|
|
import MailChimp from './VPLMailChimp.vue';
|
|
import PostHeader from './VPLPostHeader.vue';
|
|
import Tags from './VPLCollectionItemTags.vue';
|
|
|
|
const {Layout} = DefaultTheme;
|
|
|
|
let alertKey = ref(0);
|
|
let jobsKey = ref(0);
|
|
let sponsorsKey = ref(0);
|
|
let tagsKey = ref(0);
|
|
const {frontmatter, page, theme} = useData();
|
|
|
|
const alert = computed(() => frontmatter.value.alert ?? theme.value.alert ?? false);
|
|
const header = computed(() => frontmatter.value.collection || '');
|
|
const headerClass = computed(() => frontmatter.value.collection ? `collection-${frontmatter.value.collection}` : '');
|
|
const mailchimp = computed(() => frontmatter.value?.mailchimp?.action ? frontmatter.value.mailchimp : false);
|
|
const sidebarEnder = computed(() => theme.value.sidebarEnder ?? false);
|
|
|
|
watch(() => page.value.relativePath, () => {
|
|
alertKey = page.value.relativePath;
|
|
jobsKey = page.value.relativePath;
|
|
sponsorsKey = page.value.relativePath;
|
|
tagsKey = page.value.relativePath;
|
|
});
|
|
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.newsletter-wrapper {
|
|
border-top: 1px solid var(--vp-c-divider);
|
|
padding: 16px 0 ;
|
|
}
|
|
</style>
|