Files
estel_docs/app/app.vue
2025-08-07 13:39:05 +08:00

69 lines
1.5 KiB
Vue

<script setup lang="ts">
const { seo } = useAppConfig()
const { data: navigation } = await useAsyncData('navigation', () => queryCollectionNavigation('docs'))
const { data: blogNavigation } = await useAsyncData('blogNavigation', () => queryCollectionNavigation('blog'))
const { data: files } = useLazyAsyncData('search', () => queryCollectionSearchSections('docs'), {
server: false
})
// 获取主题系统
const { selectedTheme, selectedFont, selectedFontSize } = useTheme()
// 计算根元素的 CSS 类
const rootClasses = computed(() => {
const classes = []
// 添加主题类
classes.push(`theme-${selectedTheme.value}`)
// 添加字体类
classes.push(`font-${selectedFont.value}`)
// 添加字体大小类
classes.push(`text-${selectedFontSize.value}`)
return classes.join(' ')
})
useHead({
meta: [
{ name: 'viewport', content: 'width=device-width, initial-scale=1' }
],
link: [
{ rel: 'icon', href: '/favicon.ico' }
],
htmlAttrs: {
lang: 'en',
class: rootClasses
}
})
useSeoMeta({
titleTemplate: `%s - ${seo?.siteName}`,
ogSiteName: seo?.siteName,
twitterCard: 'summary_large_image'
})
provide('navigation', navigation)
provide('blogNavigation', blogNavigation)
</script>
<template>
<UApp>
<NuxtLoadingIndicator />
<UMain>
<NuxtLayout>
<NuxtPage />
</NuxtLayout>
</UMain>
<ClientOnly>
<LazyUContentSearch
:files="files"
:navigation="navigation"
placeholder="请输入关键词..."
/>
</ClientOnly>
</UApp>
</template>