@sugarat/theme 0.1.38 → 0.1.39

package/node.d.ts

@@ -101,11 +101,16 @@ declare namespace Theme {
         nextText?: string;
         /**
          * 是否展示当前正在浏览的文章在左侧
-         * @default false
+         * @default true
          */
         showSelf?: boolean;
         filter?: (page: Theme.PageData) => boolean;
         empty?: string | boolean;
+        /**
+         * 设置推荐文章的展示风格
+         * @default 'card'
+         */
+        style?: 'card' | 'sidebar';
     }
     interface HomeBlog {
         name?: string;
@@ -244,6 +249,11 @@ declare namespace Theme {
          * @default false
          */
         mermaid?: any;
+        /**
+         * 设置解析 frontmatter 里 date 的时区
+         * @default 8 => 'UTC+8'
+         * */
+        timeZone?: number;
     }
     interface Config extends DefaultTheme.Config {
         blog?: BlogConfig;

package/node.js

@@ -42,7 +42,7 @@ var import_fs = __toESM(require("fs"));
 var import_child_process = require("child_process");
 var import_path = __toESM(require("path"));
 
-// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.0.0-beta.2_vue@3.2.45/node_modules/vitepress-plugin-tabs/dist/index.js
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.0.0-beta.7_vue@3.3.4/node_modules/vitepress-plugin-tabs/dist/index.js
 var tabsMarker = "=tabs";
 var tabsMarkerLen = tabsMarker.length;
 var ruleBlockTabs = (state, startLine, endLine, silent) => {
@@ -268,8 +268,9 @@ function getThemeConfig(cfg) {
     if (!meta.date) {
       meta.date = getFileBirthTime(v);
     } else {
+      const timeZone = cfg?.timeZone ?? 8;
       meta.date = formatDate(
-        new Date(`${new Date(meta.date).toUTCString()}+8`)
+        new Date(`${new Date(meta.date).toUTCString()}+${timeZone}`)
       );
     }
     meta.categories = typeof meta.categories === "string" ? [meta.categories] : meta.categories;
@@ -436,7 +437,7 @@ function getTextSummary(text, count = 100) {
   return clearMatterContent(text).match(/^# ([\s\S]+)/m)?.[1]?.replace(/#/g, "")?.replace(/!\[.*?\]\(.*?\)/g, "")?.replace(/\[(.*?)\]\(.*?\)/g, "$1")?.replace(/\*\*(.*?)\*\*/g, "$1")?.split("\n")?.filter((v) => !!v)?.slice(1)?.join("\n")?.replace(/>(.*)/, "")?.slice(0, count);
 }
 function assignMermaid(config) {
-  if (!config.mermaid)
+  if (!config?.mermaid)
     return;
   if (!config.vite)
     config.vite = {};
@@ -475,7 +476,7 @@ function defineConfig(config) {
       console.warn("https://theme.sugarat.top/config/global.html");
     }, 1200);
   }
-  const extendThemeConfig = config.extends?.themeConfig?.blog;
+  const extendThemeConfig = config.extends?.themeConfig?.blog || {};
   const resultConfig = extendThemeConfig.mermaid === false ? config : {
     ...config,
     mermaid: extendThemeConfig.mermaid === true ? {} : extendThemeConfig.mermaid

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sugarat/theme",
-  "version": "0.1.38",
+  "version": "0.1.39",
   "description": "简约风的 Vitepress 博客主题，sugarat vitepress blog theme",
   "main": "src/index.ts",
   "exports": {
@@ -50,9 +50,9 @@
     "sass": "^1.56.1",
     "tsup": " ^6.5.0",
     "typescript": "^4.8.2",
-    "vitepress": "1.0.0-beta.2",
+    "vitepress": "1.0.0-beta.7",
     "vitepress-plugin-tabs": "^0.2.0",
-    "vue": "^3.2.45"
+    "vue": "^3.3.4"
   },
   "scripts": {
     "dev": "npm run build:node && npm run dev:docs",

package/src/components/BlogArticleAnalyze.vue

@@ -10,7 +10,7 @@
     </span>
   </div>
   <div class="meta-des" ref="$des" id="hack-article-des">
-    <!-- TODO：是否需要原创？转载等标签，理论上可以添加标签解决 -->
+    <!-- TODO：是否需要原创？转载等标签，理论上可以添加标签解决，可以参考 charles7c -->
     <span v-if="author && !hiddenAuthor" class="author">
       <el-icon title="本文作者"><UserFilled /></el-icon>
       <a

package/src/components/BlogRecommendArticle.vue

@@ -1,12 +1,13 @@
 <template>
   <div
-    class="card recommend"
+    class="recommend"
+    :class="{ card: sidebarStyle === 'card' }"
     v-if="_recommend !== false && (recommendList.length || emptyText)"
     data-pagefind-ignore="all"
   >
     <!-- 头部 -->
     <div class="card-header">
-      <span class="title">{{ title }}</span>
+      <span class="title" v-if="title">{{ title }}</span>
       <el-button
         v-if="showChangeBtn"
         size="small"
@@ -20,7 +21,7 @@
     <ol class="recommend-container" v-if="currentWikiData.length">
       <li v-for="(v, idx) in currentWikiData" :key="v.route">
         <!-- 序号 -->
-        <i class="num">{{ idx + 1 }}</i>
+        <i class="num">{{ startIdx + idx + 1 }}</i>
         <!-- 简介 -->
         <div class="des">
           <!-- title -->
@@ -47,20 +48,27 @@
 
 <script lang="ts" setup>
 import { ref, computed } from 'vue'
-import { ElButton, ElLink } from 'element-plus'
 import { useRoute, withBase } from 'vitepress'
+import { ElButton, ElLink } from 'element-plus'
 import { formatShowDate } from '../utils/index'
 import { useArticles, useBlogConfig } from '../composables/config/blog'
 
 const { recommend: _recommend } = useBlogConfig()
 
+const sidebarStyle = computed(() =>
+  _recommend && _recommend?.style ? _recommend.style : 'card'
+)
+
+const recommendPadding = computed(() =>
+  sidebarStyle.value === 'card' ? '10px' : '0px'
+)
 const recommend = computed(() =>
   _recommend === false ? undefined : _recommend
 )
-const title = computed(() => recommend.value?.title || '🔍 相关文章')
+const title = computed(() => recommend.value?.title ?? '🔍 相关文章')
 const pageSize = computed(() => recommend.value?.pageSize || 9)
 const nextText = computed(() => recommend.value?.nextText || '换一组')
-const emptyText = computed(() => recommend.value?.empty ?? '暂无推荐文章')
+const emptyText = computed(() => recommend.value?.empty ?? '暂无相关文章')
 
 const docs = useArticles()
 
@@ -110,6 +118,8 @@ const changePage = () => {
     currentPage.value % Math.ceil(recommendList.value.length / pageSize.value)
   currentPage.value = newIdx + 1
 }
+// 当前页开始的序号
+const startIdx = computed(() => (currentPage.value - 1) * pageSize.value)
 
 const currentWikiData = computed(() => {
   const startIdx = (currentPage.value - 1) * pageSize.value
@@ -143,7 +153,7 @@ const showChangeBtn = computed(() => {
 
 .recommend {
   flex-direction: column;
-  padding: 16px 10px;
+  padding: v-bind(recommendPadding);
 }
 
 .recommend-container {
@@ -163,7 +173,7 @@ const showChangeBtn = computed(() => {
       color: var(--description-font-color);
       font-weight: 600;
       margin: 6px 8px 10px 0;
-      width: 18px;
+      width: 22px;
       height: 18px;
       line-height: 18px;
       text-align: center;

package/src/components/BlogSidebar.vue

@@ -1,19 +1,35 @@
-<template>
-  <div class="sidebar" data-pagefind-ignore="all"><BlogRecommendArticle /></div>
-</template>
-
 <script lang="ts" setup>
+import { computed } from 'vue'
+import { useBlogConfig } from '../composables/config/blog'
 import BlogRecommendArticle from './BlogRecommendArticle.vue'
+
+const { recommend: _recommend } = useBlogConfig()
+
+const sidebarStyle = computed(() =>
+  _recommend && _recommend?.style ? _recommend.style : 'card'
+)
+const marginTop = computed(() =>
+  sidebarStyle.value === 'card' ? '40px' : '0px'
+)
+const marginTopMini = computed(() =>
+  sidebarStyle.value === 'card' ? '60px' : '0px'
+)
 </script>
 
+<template>
+  <div v-if="_recommend !== false" class="sidebar" data-pagefind-ignore="all">
+    <BlogRecommendArticle />
+  </div>
+</template>
+
 <style lang="scss" scoped>
 .sidebar {
-  margin-top: 40px;
+  margin-top: v-bind(marginTop);
 }
 
 @media screen and (min-width: 960px) and (max-width: 1120px) {
   .sidebar {
-    margin-top: 60px;
+    margin-top: v-bind(marginTopMini);
   }
 }
 </style>

package/src/composables/config/index.ts

@@ -106,11 +106,16 @@ export namespace Theme {
     nextText?: string
     /**
      * 是否展示当前正在浏览的文章在左侧
-     * @default false
+     * @default true
      */
     showSelf?: boolean
     filter?: (page: Theme.PageData) => boolean
     empty?: string | boolean
+    /**
+     * 设置推荐文章的展示风格
+     * @default 'card'
+     */
+    style?: 'card' | 'sidebar'
   }
 
   export interface HomeBlog {
@@ -264,6 +269,11 @@ export namespace Theme {
      * @default false
      */
     mermaid?: any
+    /**
+     * 设置解析 frontmatter 里 date 的时区
+     * @default 8 => 'UTC+8'
+     * */
+    timeZone?: number
   }
 
   export interface Config extends DefaultTheme.Config {

package/src/node.ts

@@ -45,7 +45,6 @@ export function getThemeConfig(cfg?: Partial<Theme.BlogConfig>) {
 
       const fileContent = fs.readFileSync(v, 'utf-8')
 
-      // TODO: 支持JSON
       const meta: Partial<Theme.PageMeta> = {
         ...matter(fileContent).data
       }
@@ -59,9 +58,9 @@ export function getThemeConfig(cfg?: Partial<Theme.BlogConfig>) {
         // })
         meta.date = getFileBirthTime(v)
       } else {
-        // TODO: 开放配置，设置时区
+        const timeZone = cfg?.timeZone ?? 8
         meta.date = formatDate(
-          new Date(`${new Date(meta.date).toUTCString()}+8`)
+          new Date(`${new Date(meta.date).toUTCString()}+${timeZone}`)
         )
       }
 
@@ -310,7 +309,7 @@ function getTextSummary(text: string, count = 100) {
 }
 
 export function assignMermaid(config: any) {
-  if (!config.mermaid) return
+  if (!config?.mermaid) return
 
   if (!config.vite) config.vite = {}
   if (!config.vite.plugins) config.vite.plugins = []
@@ -353,8 +352,8 @@ export function defineConfig(config: UserConfig<Theme.Config>): any {
     }, 1200)
   }
   // @ts-ignore
-  const extendThemeConfig = config.extends?.themeConfig
-    ?.blog as Theme.BlogConfig
+  const extendThemeConfig = (config.extends?.themeConfig?.blog ||
+    {}) as Theme.BlogConfig
 
   // 开关支持Mermaid
   const resultConfig =