准备修复一些控制台警告
This commit is contained in:
@@ -27,7 +27,7 @@ const handleLoginRegister = (type: "login" | "register") => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Uheader
|
||||
<Header
|
||||
class="header bg-gray-50 dark:bg-gray-900 border-b border-gray-200 dark:border-gray-800 sticky top-0 z-50"
|
||||
>
|
||||
<div class="px-2 sm:px-4 lg:px-6">
|
||||
@@ -67,7 +67,7 @@ const handleLoginRegister = (type: "login" | "register") => {
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<UContentSearchButton v-if="header?.search" class="lg:hidden" />
|
||||
<UContentSearchButton class="lg:hidden" />
|
||||
<div class="ml-auto flex items-center space-x-2">
|
||||
<UColorModeSwitch />
|
||||
|
||||
@@ -117,7 +117,7 @@ const handleLoginRegister = (type: "login" | "register") => {
|
||||
</div>
|
||||
<!-- Theme Settings Panel -->
|
||||
<ThemeSettings :is-open="isSettingsOpen" @close="isSettingsOpen = false" />
|
||||
</Uheader>
|
||||
</Header>
|
||||
|
||||
<!-- 登录模态框 -->
|
||||
<UModal v-model:open="isLoginModalOpen" title="登录" :dismissible="false">
|
||||
|
@@ -1,20 +1,15 @@
|
||||
<template>
|
||||
<aside
|
||||
class="w-64 bg-white dark:bg-gray-900 flex flex-col h-screen border-r border-gray-200 dark:border-gray-700 overflow-hidden"
|
||||
>
|
||||
class="w-64 bg-white dark:bg-gray-900 flex flex-col h-screen border-r border-gray-200 dark:border-gray-700 overflow-hidden">
|
||||
<!-- Logo -->
|
||||
<div class="flex-shrink-0 p-4 border-gray-200 dark:border-gray-700">
|
||||
<!-- Logo and Site Name -->
|
||||
<div class="h-8">
|
||||
<NuxtLink to="/" class="flex items-center space-x-3">
|
||||
<div
|
||||
class="w-8 h-8 bg-primary rounded-xl flex items-center justify-center shadow-md"
|
||||
>
|
||||
<div class="w-8 h-8 bg-primary rounded-xl flex items-center justify-center shadow-md">
|
||||
<span class="text-white font-bold text-lg">E</span>
|
||||
</div>
|
||||
<span class="text-lg font-bold text-gray-800 dark:text-white"
|
||||
>简单文档</span
|
||||
>
|
||||
<span class="text-lg font-bold text-gray-800 dark:text-white">简单文档</span>
|
||||
<TemplateMenu />
|
||||
</NuxtLink>
|
||||
</div>
|
||||
@@ -23,81 +18,60 @@
|
||||
<!-- Search Box -->
|
||||
<div class="p-4 border-gray-200 dark:border-gray-700">
|
||||
<ClientOnly>
|
||||
<UContentSearchButton
|
||||
v-if="header?.search"
|
||||
:collapsed="false"
|
||||
loading="true"
|
||||
label="搜索文档"
|
||||
description="请输入关键词"
|
||||
class="w-full"
|
||||
color="primary"
|
||||
/>
|
||||
<UContentSearchButton :collapsed="false" loading="true" label="搜索文档" description="请输入关键词" class="w-full"
|
||||
color="primary" />
|
||||
</ClientOnly>
|
||||
</div>
|
||||
|
||||
<!-- 可滚动的导航区域 -->
|
||||
<div
|
||||
class=" h-full overflow-y-auto "
|
||||
<div class=" h-full overflow-y-auto ">
|
||||
|
||||
>
|
||||
<!-- 导航 Section -->
|
||||
|
||||
<!-- 导航 Section -->
|
||||
<div>
|
||||
<NuxtLink to="/"
|
||||
class="flex items-center px-4 py-2 text-sm font-medium rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-800 hover:shadow-sm transition-all duration-200"
|
||||
:class="{
|
||||
'bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-400 shadow-sm':
|
||||
$route.path === '/',
|
||||
}">
|
||||
<Icon name="lucide-home" class="text-primary mr-2" size="20" />
|
||||
站点首页
|
||||
</NuxtLink>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<NuxtLink
|
||||
to="/"
|
||||
class="flex items-center px-4 py-2 text-sm font-medium rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-800 hover:shadow-sm transition-all duration-200"
|
||||
:class="{
|
||||
'bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-400 shadow-sm':
|
||||
$route.path === '/',
|
||||
}"
|
||||
>
|
||||
<Icon name="lucide-home" class="text-primary mr-2" size="20" />
|
||||
站点首页
|
||||
</NuxtLink>
|
||||
</div>
|
||||
<!-- 总目录及展示页导航 -->
|
||||
<div class="flex items-center px-8 p-1">
|
||||
<ContentDirectory />
|
||||
</div>
|
||||
|
||||
<!-- 总目录及展示页导航 -->
|
||||
<div class="flex items-center px-8 p-1">
|
||||
<ContentDirectory />
|
||||
</div>
|
||||
<!-- 分隔线 -->
|
||||
<div class="mt-4 uppercase tracking-wider border-t border-gray-200 dark:border-gray-700 w-3/5 mx-5" />
|
||||
|
||||
<!-- 分隔线 -->
|
||||
<div
|
||||
class="mt-4 uppercase tracking-wider border-t border-gray-200 dark:border-gray-700 w-3/5 mx-5"
|
||||
/>
|
||||
<!-- 文档目录导航 -->
|
||||
<div class="mt-6 flex items-center justify-start pl-8 w-4/5">
|
||||
|
||||
<!-- 文档目录导航 -->
|
||||
<div class="mt-6 flex items-center justify-start pl-8 w-4/5">
|
||||
<NuxtLink>
|
||||
<UContentNavigation highlight :navigation="navigation" color="primary" type="single" variant="pill" :ui="{
|
||||
root: '',
|
||||
content: '',
|
||||
list: 'group relative -mx-5 -mt-3',
|
||||
item: '',
|
||||
listWithChildren: 'ms-3 border-s border-default',
|
||||
itemWithChildren: 'flex flex-col',
|
||||
trigger: 'font-semibold',
|
||||
link: '',
|
||||
linkLeadingIcon: 'shrink-0 size-5',
|
||||
linkTrailing: 'ms-auto inline-flex gap-1.5 items-center',
|
||||
linkTrailingBadge: 'shrink-0',
|
||||
linkTrailingBadgeSize: 'sm',
|
||||
linkTrailingIcon: 'size-5 transform transition-transform duration-200 shrink-0 group-data-[state=open]:rotate-90',
|
||||
linkTitle: '',
|
||||
linkTitleExternalIcon: 'size- align-top text-dimmed'
|
||||
}" />
|
||||
</NuxtLink>
|
||||
|
||||
|
||||
<UContentNavigation
|
||||
highlight
|
||||
:navigation="navigation"
|
||||
color="primary"
|
||||
type="single"
|
||||
variant="pill"
|
||||
:ui="{
|
||||
root: '',
|
||||
content: '',
|
||||
list: 'group relative -mx-5 -mt-3',
|
||||
item: '',
|
||||
listWithChildren: 'ms-3 border-s border-default',
|
||||
itemWithChildren: 'flex flex-col',
|
||||
trigger: 'font-semibold',
|
||||
link: '',
|
||||
linkLeadingIcon: 'shrink-0 size-5',
|
||||
linkTrailing: 'ms-auto inline-flex gap-1.5 items-center',
|
||||
linkTrailingBadge: 'shrink-0',
|
||||
linkTrailingBadgeSize: 'sm',
|
||||
linkTrailingIcon: 'size-5 transform transition-transform duration-200 shrink-0 group-data-[state=open]:rotate-90',
|
||||
linkTitle: '',
|
||||
linkTitleExternalIcon: 'size- align-top text-dimmed'
|
||||
}"
|
||||
/>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</aside>
|
||||
|
@@ -5,23 +5,6 @@
|
||||
highlight
|
||||
color="primary"
|
||||
variant="pill"
|
||||
:ui="{
|
||||
root: '',
|
||||
content: 'data-[state=open]:animate-[accordion-down_200ms_ease-out] data-[state=closed]:animate-[accordion-up_200ms_ease-out] overflow-hidden focus:outline-none',
|
||||
list: 'isolate -mx-2.5 -mt-1.5',
|
||||
item: '',
|
||||
listWithChildren: 'ms-5 border-s border-default',
|
||||
itemWithChildren: 'flex flex-col data-[state=open]:mb-1.5',
|
||||
trigger: 'font-semibold',
|
||||
link: 'group relative w-full px-2.5 py-1.5 before:inset-y-px before:inset-x-0 flex items-center gap-1.5 text-sm before:absolute before:z-[-1] before:rounded-md focus:outline-none focus-visible:outline-none focus-visible:before:ring-inset focus-visible:before:ring-2',
|
||||
linkLeadingIcon: 'shrink-0 size-5',
|
||||
linkTrailing: 'ms-auto inline-flex gap-1.5 items-center',
|
||||
linkTrailingBadge: 'shrink-0',
|
||||
linkTrailingBadgeSize: 'sm',
|
||||
linkTrailingIcon: 'size-5 transform transition-transform duration-200 shrink-0 group-data-[state=open]:rotate-180',
|
||||
linkTitle: 'truncate',
|
||||
linkTitleExternalIcon: 'size-3 align-top text-dimmed'
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
18
app/components/content/ProseH1.vue
Normal file
18
app/components/content/ProseH1.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<h1 :id class="scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl">
|
||||
<NuxtLink
|
||||
v-if="generate"
|
||||
:to="`#${id}`"
|
||||
>
|
||||
<slot />
|
||||
</NuxtLink>
|
||||
<slot v-else />
|
||||
</h1>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const { id } = defineProps<{ id?: string }>();
|
||||
|
||||
const { headings } = useRuntimeConfig().public.mdc;
|
||||
const generate = computed(() => id && ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h1)));
|
||||
</script>
|
18
app/components/content/ProseH2.vue
Normal file
18
app/components/content/ProseH2.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<h2 :id class="scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight transition-colors [&:not(:first-child)]:mt-10">
|
||||
<NuxtLink
|
||||
v-if="id && generate"
|
||||
:to="`#${id}`"
|
||||
>
|
||||
<slot />
|
||||
</NuxtLink>
|
||||
<slot v-else />
|
||||
</h2>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const { id } = defineProps<{ id?: string }>();
|
||||
|
||||
const { headings } = useRuntimeConfig().public.mdc;
|
||||
const generate = computed(() => id && ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h2)));
|
||||
</script>
|
18
app/components/content/ProseH3.vue
Normal file
18
app/components/content/ProseH3.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<h3 :id class="scroll-m-20 text-2xl font-semibold tracking-tight [&:not(:first-child)]:mt-8">
|
||||
<NuxtLink
|
||||
v-if="id && generate"
|
||||
:to="`#${id}`"
|
||||
>
|
||||
<slot />
|
||||
</NuxtLink>
|
||||
<slot v-else />
|
||||
</h3>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const { id } = defineProps<{ id?: string }>();
|
||||
|
||||
const { headings } = useRuntimeConfig().public.mdc;
|
||||
const generate = computed(() => id && ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h3)));
|
||||
</script>
|
18
app/components/content/ProseH4.vue
Normal file
18
app/components/content/ProseH4.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<h4 :id class="scroll-m-20 text-xl font-semibold tracking-tight [&:not(:first-child)]:mt-6">
|
||||
<NuxtLink
|
||||
v-if="id && generate"
|
||||
:to="`#${id}`"
|
||||
>
|
||||
<slot />
|
||||
</NuxtLink>
|
||||
<slot v-else />
|
||||
</h4>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const { id } = defineProps<{ id?: string }>();
|
||||
|
||||
const { headings } = useRuntimeConfig().public.mdc;
|
||||
const generate = computed(() => id && ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h4)));
|
||||
</script>
|
18
app/components/content/ProseH5.vue
Normal file
18
app/components/content/ProseH5.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<h5 :id class="scroll-m-20 text-lg font-semibold tracking-tight [&:not(:first-child)]:mt-6">
|
||||
<NuxtLink
|
||||
v-if="id && generate"
|
||||
:to="`#${id}`"
|
||||
>
|
||||
<slot />
|
||||
</NuxtLink>
|
||||
<slot v-else />
|
||||
</h5>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const { id } = defineProps<{ id?: string }>();
|
||||
|
||||
const { headings } = useRuntimeConfig().public.mdc;
|
||||
const generate = computed(() => id && ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h5)));
|
||||
</script>
|
18
app/components/content/ProseH6.vue
Normal file
18
app/components/content/ProseH6.vue
Normal file
@@ -0,0 +1,18 @@
|
||||
<template>
|
||||
<h6 :id class="scroll-m-20 text-lg font-semibold tracking-tight [&:not(:first-child)]:mt-6">
|
||||
<NuxtLink
|
||||
v-if="id && generate"
|
||||
:to="`#${id}`"
|
||||
>
|
||||
<slot />
|
||||
</NuxtLink>
|
||||
<slot v-else />
|
||||
</h6>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const { id } = defineProps<{ id?: string }>();
|
||||
|
||||
const { headings } = useRuntimeConfig().public.mdc;
|
||||
const generate = computed(() => id && ((typeof headings?.anchorLinks === 'boolean' && headings?.anchorLinks === true) || (typeof headings?.anchorLinks === 'object' && headings?.anchorLinks?.h6)));
|
||||
</script>
|
Reference in New Issue
Block a user