docs: add how to migrate from hexo to valaxy

docs/pages/guide/built-ins/index.md

@@ -20,3 +20,5 @@ Valaxy 内置了几个简单的组件。
 ## 辅助组件
 
 > 面向用户，可直接使用
+
+TODO

docs/pages/guide/features.md

@@ -120,11 +120,13 @@ npm run build:spa
 ## SEO
 
 Valaxy 已经默认集成了 Open Graph 的 SEO 优化，您无需为此操心。
-但需要注意的是，对于大部分搜索引擎来说，他们可能只青睐 SSG 的构建模式。
+但需要注意的是，对于许多搜索引擎来说，他们可能只青睐 SSG 的构建模式。
 
 ## RSS
 
-独立地 RSS 构建
+自带命令生成 RSS 订阅源。
+
+> [RSS 是什么？](https://baike.baidu.com/item/rss/24470)
 
 ```bash
 npm run rss

docs/pages/migration/hexo.md

@@ -0,0 +1,32 @@
+---
+title_zh: 从 Hexo 迁移至 Valaxy
+title: Migrate from Hexo to Valaxy
+categories:
+  - Migration
+end: true
+---
+
+## 迁移步骤
+
+### 迁移内容
+
+Hexo 博客目录与 Valaxy 博客目录对应关系如下，将相关内容复制至对应文件夹即可。
+
+> 譬如**迁移文章**，即将 Hexo `source/_posts` 目录下内容复制至 Valaxy `pages/posts` 目录下。
+
+|用途|Hexo|Valaxy|
+|---|---|---|
+|文章（Markdown 文件）|`source/_posts`|`pages/posts`|
+|页面（Markdown / Html）|`source`|`pages`|
+|静态资源（`*.js` / `*.css` / `CNAME` etc.）|`source`|`public`|
+
+### 迁移配置
+
+参考 [Valaxy 配置文档](/guide/config) 将 Hexo `_config.yml` 配置文件中的内容，迁移至 `valaxy.config.ts` 文件中。
+
+> 配置示例：[demo/yun/valaxy.config.ts](https://github.com/YunYouJun/valaxy/blob/main/demo/yun/valaxy.config.ts)、[yunyoujun.github.io/valaxy.config.ts](https://github.com/YunYouJun/yunyoujun.github.io/blob/valaxy/valaxy.config.ts)  
+> `valaxy.config.ts` 提供了完备的类型提示，这意味着你在 VSCode 中可以直接鼠标悬浮查看各参数注释。
+
+## 示例
+
+更复杂的迁移示例，您还可以对比 [yunyoujun.github.io | GitHub](https://github.com/YunYouJun/yunyoujun.github.io) 仓库 [hexo](https://github.com/YunYouJun/yunyoujun.github.io/tree/hexo) 分支与 [valaxy](https://github.com/YunYouJun/yunyoujun.github.io/tree/valaxy) 的异同。

docs/valaxy.config.ts

@@ -14,29 +14,51 @@ export default defineValaxyConfig<PressTheme.Config>({
 
   theme: 'press',
   themeConfig: {
-    sidebar: ['Getting Started', 'Guide', 'built-ins', 'Third', 'Custom', 'Theme', 'Addon', 'Dev'],
+    sidebar: ['Getting Started', 'Guide', 'Migration', 'built-ins', 'Third', 'Custom', 'Theme', 'Addon', 'Dev'],
     nav: [
       {
-        text: 'FAQ',
-        link: '/dev/faq',
+        text: 'Docs',
+        items: [
+          {
+            text: 'Getting Started',
+            link: '/guide/getting-started',
+          },
+          {
+            text: 'Migration from Hexo',
+            link: '/migration/hexo',
+          },
+        ],
       },
       {
-        text: 'Guide',
-        link: '/guide/getting-started',
+        text: 'Themes',
+        items: [
+          {
+            text: 'Use Theme',
+            link: '/themes/use',
+          },
+          {
+            text: 'Write A Theme',
+            link: '/themes/write',
+          },
+          {
+            text: 'Themes Gallery',
+            link: '/themes/gallery',
+          },
+        ],
       },
       {
         text: 'Addons',
         items: [
           {
-            text: 'index',
+            text: 'Why need addons?',
             link: '/addons',
           },
           {
-            text: 'use',
+            text: 'Use A Addon',
             link: '/addons/use',
           },
           {
-            text: 'write',
+            text: 'Write A Addon',
             link: '/addons/write',
           },
         ],

packages/valaxy-theme-press/components/PressCategories.vue

@@ -23,7 +23,7 @@ const sidebar = computed(() => themeConfig.value.sidebar)
 </script>
 
 <template>
-  <ul v-for="item in sidebar" :key="item" class="category-list" m="l-4">
+  <ul v-for="item in sidebar" :key="item" class="category-list">
     <PressCategory
       v-if="categories.get(item)"
       :name="item" :category="categories.get(item)"

packages/valaxy-theme-press/components/nav/PressNavBar.vue

@@ -35,16 +35,24 @@ const themeConfig = useThemeConfig()
   </div>
 </template>
 
-<style lang="scss" scoped>
+<style lang="scss">
 @use 'valaxy/client/styles/mixins' as *;
 
+:root {
+  --pr-navbar-c-bg: rgba(255, 255, 255, 0.8);
+}
+
+.dark {
+  --pr-navbar-c-bg: rgba(36, 36, 36, 0.8);
+}
+
 .press-navbar {
   position: relative;
   border-bottom: 1px solid var(--pr-c-divider-light);
   padding: 0 8px 0 24px;
   height: var(--pr-nav-height);
   transition: border-color 0.5s;
-  background-color: var(--va-c-bg);
+  background-color: var(--pr-navbar-c-bg);
 }
 
 @include media('md') {
@@ -59,11 +67,6 @@ const themeConfig = useThemeConfig()
     padding-right: 32px;
     -webkit-backdrop-filter: saturate(50%) blur(8px);
     backdrop-filter: saturate(50%) blur(8px);
-    background: rgba(255, 255, 255, 0.7);
-  }
-
-  .dark .press-navbar.has-sidebar .content {
-    background: rgba(36, 36, 36, 0.7);
   }
 
   @supports not (backdrop-filter: saturate(50%) blur(8px)) {
@@ -105,8 +108,4 @@ const themeConfig = useThemeConfig()
 .appearance + .social-links::before {
   margin-left: 16px;
 }
-
-.social-links {
-  margin-right: -8px;
-}
 </style>

packages/valaxy-theme-press/components/nav/PressNavItemGroup.vue

@@ -60,7 +60,7 @@ const open = ref(false)
   opacity: 0;
   visibility: hidden;
   transition: opacity 0.25s, visibility 0.25s, transform 0.25s;
-  transform: translateX(-50%) translateY(calc(var(--pr-nav-height) - 10px));
+  transform: translateX(-50%) translateY(calc(var(--pr-nav-height) / 2));
 
   border-radius: 12px;
   padding: 12px;

packages/valaxy/client/styles/vars.scss

@@ -4,7 +4,7 @@ $common: () !default;
 $common: map.merge(
   (
     "aside-width": 256px,
-    "sidebar-width": 320px,
+    "sidebar-width": 300px,
   ),
   $common
 );