feat(docs): replace logo with SVG and update navigation styling

- Replace PNG logo with high-definition SVG version for better quality and scalability
- Update navigation to use logo image instead of text title for improved branding
- Add custom styling for logo display in navigation bar
- Exclude navigation logo from automatic image styling rules
- Update sitemap timestamps to reflect recent changes

docs/.vitepress/config.mjs

@@ -306,7 +306,8 @@ const commonHead = [
 ]
 
 const commonThemeConfig = {
-  logo: `${base}logo.png`.replace('//', '/'),
+  logo: '/assets/easy-vibe-logo-hd.svg',
+  siteTitle: false,
   search: {
     provider: 'local'
   },

docs/.vitepress/theme/Layout.vue

@@ -1,6 +1,6 @@
 <script setup>
 import DefaultTheme from 'vitepress/theme'
-import { useData, useRoute } from 'vitepress'
+import { useData, useRoute, withBase } from 'vitepress'
 import TextType from './components/TextType.vue'
 import GitHubStars from './components/GitHubStars.vue'
 import { onMounted, ref, watch, computed } from 'vue'
@@ -11,6 +11,13 @@ import easyVibePaths from './data/easyVibePaths.json'
 const { frontmatter } = useData()
 const route = useRoute()
 
+const openWelcomeFromWordmark = () => {
+  const currentPath = window.location.pathname
+  window.location.href = withBase(
+    `/welcome/?next=${encodeURIComponent(currentPath)}`
+  )
+}
+
 const homeTaglineTyping = {
   typingSpeed: 45,
   initialDelay: 0,
@@ -418,9 +425,12 @@ watch(sidebarCollapsed, (collapsed) => {
       </ClientOnly>
     </template>
     <template #home-hero-info-before>
-      <div
+      <button
         v-if="frontmatter.layout === 'home'"
         class="vp-home-wordmark"
+        type="button"
+        aria-label="打开欢迎页"
+        @click="openWelcomeFromWordmark"
       >
         <svg
           viewBox="0 0 460 220"
@@ -447,7 +457,7 @@ watch(sidebarCollapsed, (collapsed) => {
             class="vp-home-wordmark-path"
           />
         </svg>
-      </div>
+      </button>
     </template>
     <template #home-hero-info-after>
       <div
@@ -493,6 +503,16 @@ watch(sidebarCollapsed, (collapsed) => {
 </template>
 
 <style>
+.VPNavBarTitle .VPImage.logo,
+.VPNavBarTitle .logo {
+  width: 84px !important;
+  height: 40px !important;
+  max-width: 84px !important;
+  max-height: 40px !important;
+  object-fit: contain;
+  display: block;
+}
+
 /* 隐藏默认的 tagline，因为我们用打字机效果替代了它 */
 .VPHomeHero .tagline {
   display: none !important;
@@ -542,6 +562,11 @@ watch(sidebarCollapsed, (collapsed) => {
   justify-content: center;
   margin-top: -12px;
   margin-bottom: 18px;
+  width: 100%;
+  padding: 0;
+  border: none;
+  background: transparent;
+  cursor: pointer;
 }
 .vp-home-wordmark-svg {
   width: min(380px, 52vw);

docs/.vitepress/theme/components/HomeFeatures.vue

@@ -1650,11 +1650,6 @@ const topPromoStyle = computed(() => {
   }
 })
 
-const replayIntro = () => {
-  const currentPath = window.location.pathname
-  router.go(withBase(`/welcome/?next=${encodeURIComponent(currentPath)}`))
-}
-
 onMounted(() => {
   const introDuration = 1800
   const colorDelay = 500
@@ -1920,13 +1915,19 @@ const appendixCards = [
     <nav class="sticky-nav glass">
       <div class="nav-content">
         <div class="nav-cluster">
-          <button
+          <div
             class="nav-title"
-            type="button"
-            @click="replayIntro"
+            :aria-label="t.nav.title"
           >
-            {{ t.nav.title }}
-          </button>
+            <img
+              class="nav-title-logo"
+              :src="withBase('/assets/easy-vibe-logo-hd.svg')"
+              :alt="t.nav.title"
+              width="64"
+              height="30"
+              draggable="false"
+            >
+          </div>
           <div class="nav-links">
             <button
               :class="{ active: activeTab === 'home' }"
@@ -2346,16 +2347,27 @@ a {
 }
 
 .nav-title {
-  font-weight: 500;
-  font-size: 12px;
-  color: var(--vp-c-text-1) !important;
   flex-shrink: 0;
-  letter-spacing: -0.008em;
   background: none;
   border: none;
   padding: 0;
   margin: 0;
-  cursor: pointer;
+  cursor: default;
+  display: inline-flex;
+  align-items: center;
+}
+
+.nav-title-logo {
+  display: block;
+  max-width: 64px !important;
+  max-height: 30px !important;
+  height: 30px !important;
+  width: 64px !important;
+  min-width: 64px;
+  min-height: 30px;
+  object-fit: contain;
+  flex: 0 0 auto;
+  filter: grayscale(1) brightness(0.28) contrast(1.05);
 }
 
 .nav-links {

docs/.vitepress/theme/index.js

@@ -1787,6 +1787,7 @@ export default {
     }
 
     const applyImageStyle = (img) => {
+      if (img.classList.contains('nav-title-logo')) return
       const { naturalWidth, naturalHeight } = img
       if (!naturalWidth || !naturalHeight) return
 

docs/public/sitemap.xml

@@ -3,7 +3,7 @@
          xmlns:xhtml="http://www.w3.org/1999/xhtml">
   <url>
     <loc>https://datawhalechina.github.io/easy-vibe/zh-cn/</loc>
-    <lastmod>2026-03-16T00:53:29+08:00</lastmod>
+    <lastmod>2026-03-18T12:12:42+08:00</lastmod>
     <changefreq>weekly</changefreq>
     <priority>1.0</priority>
     <xhtml:link rel="alternate" hreflang="zh-CN" href="https://datawhalechina.github.io/easy-vibe/zh-cn/"/>
@@ -921,7 +921,7 @@
   </url>
   <url>
     <loc>https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/2.2-database-supabase/</loc>
-    <lastmod>2026-02-27T18:45:52+08:00</lastmod>
+    <lastmod>2026-03-18T09:34:06+08:00</lastmod>
     <changefreq>weekly</changefreq>
     <priority>0.8</priority>
     <xhtml:link rel="alternate" hreflang="zh-CN" href="https://datawhalechina.github.io/easy-vibe/zh-cn/stage-2/backend/2.2-database-supabase/"/>