chore: 初始化项目仓库

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-31 21:27:39 +08:00
commit b7addb5c7a
50 changed files with 15964 additions and 0 deletions
@@ -0,0 +1,73 @@
+<script setup lang="ts">
+import { siteConfig } from '~/config/site'
+
+const route = useRoute()
+
+const breadcrumbs = computed(() => {
+  const path = route.path
+  if (path === '/') return []
+
+  const parts = path.split('/').filter(Boolean)
+  const result: Array<{ label: string; path: string }> = []
+
+  let currentPath = ''
+  for (const part of parts) {
+    currentPath += `/${part}`
+    result.push({
+      label: part,
+      path: currentPath,
+    })
+  }
+
+  return result
+})
+</script>
+
+<template>
+  <nav class="sticky top-0 z-40 w-full backdrop-blur-sm border-b"
+       style="background-color: color-mix(in srgb, var(--color-bg) 80%, transparent); border-color: var(--color-border);">
+    <div class="relative flex h-10 items-center justify-between px-2">
+      <!-- 最左边：头像 + 面包屑 -->
+      <div class="flex items-center gap-1 min-w-0">
+        <NuxtLink to="/" class="shrink-0 hover:opacity-80 transition-opacity">
+          <img
+            :src="siteConfig.avatar"
+            :alt="siteConfig.siteName"
+            class="h-6 w-6 rounded-full nav-avatar"
+          />
+        </NuxtLink>
+        <template v-for="(crumb, i) in breadcrumbs" :key="crumb.path">
+          <span class="shrink-0 text-muted-foreground/40">/</span>
+          <NuxtLink
+            :to="crumb.path"
+            class="text-xs font-medium truncate shrink min-w-0 hover:opacity-80 transition-opacity"
+            :class="i === breadcrumbs.length - 1 ? 'text-foreground' : 'text-muted-foreground'"
+          >
+            {{ crumb.label }}
+          </NuxtLink>
+        </template>
+      </div>
+
+      <!-- 最右边：主题切换 -->
+      <div class="flex items-center gap-2 shrink-0">
+        <LayoutThemeToggle />
+      </div>
+    </div>
+  </nav>
+</template>
+
+<style scoped>
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}
+
+.nav-avatar {
+  animation: spin 2s linear infinite;
+  animation-play-state: paused;
+}
+
+.nav-avatar:hover {
+  animation-play-state: running;
+}
+</style>