estel/estel_docs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

基本完成初步框架

Browse Source
This commit is contained in:
estel
2025-07-27 00:09:44 +08:00
parent e454f3f441
commit e6e258c86e
7 changed files with 50 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/components/AppHeader.vue
View File

@@ -32,7 +32,7 @@ const handleLoginRegister = (type: "login" | "register") => {
</script>
<template>
<UHeader toggle-side="left" title="Estel Docs" mode="modal">
<UHeader toggle-side="left" title="Estel Docs" mode="modal" class="bg-gray-50 dark:bg-gray-900">
<template #title>
<h6></h6>

6
app/components/AppSidebar.vue
View File

@@ -26,7 +26,7 @@
<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':
' text-blue-600 dark:text-blue-400 ':
$route.path === '/',
}">
<Icon name="lucide-home" class="text-primary mr-2" size="20" />
@@ -38,10 +38,10 @@
</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-7/9 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-4 w-full">
<UContentNavigation highlight :navigation="navigation" color="primary" type="single" variant="pill" />
</div>
</div>

2
app/components/IndexCard.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="w-full bg-gray-50 dark:bg-gray-900 min-h-screen p-2 sm:p-4 lg:p-2">
<div class="w-full bg-gray-50 dark:bg-gray-900 min-h-screen mt-4">
<!-- 响应式卡片网格 -->
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 max-w-8xl mx-auto">
<div v-for="item in firstLevelItems" :key="item.path"

37
app/components/IndexHero.vue
View File

@@ -1,25 +1,22 @@
<script setup lang="ts">
const links = ref([
{
label: 'Get started',
to: '/getting-started',
icon: 'i-lucide-square-play'
},
{
label: 'Learn more',
to: '/getting-started/theme',
color: 'neutral',
variant: 'subtle',
trailingIcon: 'i-lucide-arrow-right'
}
])
// 无需额外的脚本逻辑
</script>
<template>
<UPageHero
headline="New release"
title="Ultimate Vue UI library"
description="A Nuxt/Vue-integrated UI library providing a rich set of fully-styled, accessible and highly customizable components for building modern web applications."
:links="links"
/>
<div class="w-full top-0 left-0 bg-gray-50 dark:bg-gray-900">
<!-- 欢迎卡片 -->
<div
class="bg-slate-200 dark:bg-slate-600 rounded-lg border border-gray-200 dark:border-gray-700 p-2 sm:p-4 shadow-sm">
<h1 class="text-xl font-bold text-gray-900 dark:text-white mb-2">
Hi 👋, 欢迎使用简单文档系统
</h1>
<!-- 编号列表 -->
<div class="mt-2 text-base text-gray-700 dark:text-gray-300">
1. 登录网站！<br>
2. 创建文档，为文档添加文章！<br>
3. 拖拽文章标题进行排序，分享文档！
</div>
</div>
</div>
</template>

2
app/layouts/default.vue
View File

@@ -23,7 +23,7 @@
<!-- Main Content -->
<UMain class="flex-1 overflow-y-auto">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
<div class="mx-auto px-4 sm:px-6 lg:px-8 py-6">
<slot />
</div>
</UMain>

61
app/pages/[...slug].vue
View File

@@ -118,21 +118,11 @@ const links = computed(() => {
<template>
<UPage v-if="page" :class="pageFontSizeClass">
<UPageHeader
:title="page.title"
:description="page.description"
:headline="headline"
:ui="{
wrapper: 'flex-row items-center flex-wrap justify-between ',
}"
>
<UPageHeader :title="page.title" :description="page.description" :headline="headline" :ui="{
wrapper: 'flex-row items-center flex-wrap justify-between ',
}">
<template #links>
<UButton
v-for="(link, index) in page.links"
:key="index"
size="sm"
v-bind="link"
/>
<UButton v-for="(link, index) in page.links" :key="index" size="sm" v-bind="link" />
<DocsPageHeaderLinks />
</template>
@@ -143,25 +133,13 @@ const links = computed(() => {
<USeparator>
<div v-if="editLink" class="flex items-center gap-2 text-sm text-muted">
<UButton
variant="link"
color="neutral"
:to="editLink"
target="_blank"
icon="i-lucide-pen"
:ui="{ leadingIcon: 'size-4' }"
>
<UButton variant="link" color="neutral" :to="editLink" target="_blank" icon="i-lucide-pen"
:ui="{ leadingIcon: 'size-4' }">
编辑页面
</UButton>
or
<UButton
variant="link"
color="neutral"
:to="`${appConfig.github.url}/issues/new/choose`"
target="_blank"
icon="i-lucide-alert-circle"
:ui="{ leadingIcon: 'size-4' }"
>
<UButton variant="link" color="neutral" :to="`${appConfig.github.url}/issues/new/choose`" target="_blank"
icon="i-lucide-alert-circle" :ui="{ leadingIcon: 'size-4' }">
提交问题
</UButton>
</div>
@@ -170,21 +148,18 @@ const links = computed(() => {
</UPageBody>
<template v-if="page?.body?.toc?.links?.length" #right>
<div class="fixed top-24 right-10 overflow-y-auto">
<div class="fixed top-24 right-15 w-auto">
<UContentToc :title="appConfig.toc?.title" :links="page.body?.toc?.links">
<template v-if="appConfig.toc?.bottom" #bottom>
<div
class="hidden lg:block space-y-6 "
:class="{ '!mt-5': page.body?.toc?.links?.length }"
>
<USeparator v-if="page.body?.toc?.links?.length" type="dashed" />
<UContentToc :title="appConfig.toc?.title" :links="page.body?.toc?.links">
<template v-if="appConfig.toc?.bottom" #bottom>
<div class="hidden lg:block space-y-6 " :class="{ '!mt-5': page.body?.toc?.links?.length }">
<USeparator v-if="page.body?.toc?.links?.length" type="dashed" />
<UPageLinks :title="appConfig.toc.bottom.title" :links="links" />
</div>
</template>
</UContentToc>
</div>
<UPageLinks :title="appConfig.toc.bottom.title" :links="links" />
</div>
</template>
</UContentToc>
</div>
</template>
</UPage>
</template>

2
app/pages/index.vue
View File

@@ -18,6 +18,6 @@ useSeoMeta({
</script>
<template>
<!-- <IndexHero /> -->
<IndexHero />
<IndexCard />
</template>