@sugarat/theme 0.5.4 → 0.5.6

package/node.d.ts

@@ -181,6 +181,11 @@ declare namespace Theme {
          * 首页数据分析卡片
          */
         analysis?: HomeAnalysis;
+        /**
+         * 首页博客信息卡片是否在移动端折叠展示
+         * @default false
+         */
+        blogInfoCollapsible?: boolean;
     }
     interface ArticleConfig {
         /**
@@ -423,7 +428,7 @@ declare namespace Theme {
         backToTop?: boolean | BackToTop;
         /**
          * oh-my-live2d 的 loadOml2d 方法的配置选项
-         * 详见 https://oml2d.com/options/Options.html
+         * 详见 https://oml2d.hacxy.cn/api/interfaces/Options.html
          */
         oml2d?: Options;
         homeTags?: boolean | HomeTagsConfig;
@@ -440,7 +445,7 @@ declare namespace Theme {
         imageStyle?: ImageStyleConfig;
         groupIcon?: {
             customIcon: Record<string, string>;
-        };
+        } | false;
     }
     type FormatShowDate = {
         /**

package/node.js

@@ -41,7 +41,7 @@ module.exports = __toCommonJS(node_exports);
 // src/utils/node/mdPlugins.ts
 var import_module = require("module");
 
-// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.6.3_@algolia+client-search@5.20.0_@types+node@2_0c9e09a0b1912fa528cd2bc14eecd563/node_modules/vitepress-plugin-tabs/dist/index.js
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.6.3_@algolia+client-search@5.20.0_@types+node@2_89d33a1149fc4afc3a4b1eeb07b93bba/node_modules/vitepress-plugin-tabs/dist/index.js
 var tabsMarker = "=tabs";
 var tabsMarkerLen = tabsMarker.length;
 var ruleBlockTabs = (state, startLine, endLine, silent) => {
@@ -289,7 +289,9 @@ function getMarkdownPlugins(cfg) {
   if (cfg?.timeline !== false) {
     markdownPlugin.push(import_vitepress_markdown_timeline.default);
   }
-  markdownPlugin.push(import_vitepress_plugin_group_icons.groupIconMdPlugin);
+  if (cfg?.groupIcon !== false) {
+    markdownPlugin.push(import_vitepress_plugin_group_icons.groupIconMdPlugin);
+  }
   return markdownPlugin;
 }
 function taskCheckboxPlugin(ops) {
@@ -397,7 +399,7 @@ async function getArticleMeta(filepath, route, timeZone = defaultTimeZoneOffset,
   }
   const utcValue = timeZone >= 0 ? `+${timeZone}` : `${timeZone}`;
   const date = await (meta.date && /* @__PURE__ */ new Date(`${new Date(meta.date).toUTCString()}${utcValue}`) || (0, import_theme_shared2.getFileLastModifyTime)(filepath));
-  meta.date = formatDate(date || /* @__PURE__ */ new Date());
+  meta.date = formatDate(date || /* @__PURE__ */ new Date(), "yyyy/MM/dd hh:mm:ss");
   meta.categories = typeof meta.categories === "string" ? [meta.categories] : meta.categories;
   meta.tags = typeof meta.tags === "string" ? [meta.tags] : meta.tags;
   meta.tag = [meta.tag || []].flat().concat([
@@ -566,9 +568,25 @@ function getVitePlugins(cfg = {}) {
   if (cfg?.popover) {
     plugins.push((0, import_vitepress_plugin_announcement.AnnouncementPlugin)(cfg.popover));
   }
-  plugins.push((0, import_vitepress_plugin_group_icons2.groupIconVitePlugin)(cfg?.groupIcon));
+  if (cfg?.groupIcon !== false) {
+    plugins.push(patchGroupIconPlugin());
+    plugins.push((0, import_vitepress_plugin_group_icons2.groupIconVitePlugin)(cfg?.groupIcon));
+  }
   return plugins;
 }
+function patchGroupIconPlugin() {
+  return {
+    name: "@sugarat/theme-plugin-patch-group-icon",
+    enforce: "pre",
+    transform(code, id) {
+      if (id.match(/[\/\\]theme[\/\\]index\.(ts|js)$/)) {
+        return `import 'virtual:group-icons.css'
+${code}`;
+      }
+      return code;
+    }
+  };
+}
 function registerVitePlugins(vpCfg, plugins) {
   vpCfg.vite = {
     plugins,

package/node.mjs

@@ -9,7 +9,7 @@ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require
 // src/utils/node/mdPlugins.ts
 import { createRequire } from "module";
 
-// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.6.3_@algolia+client-search@5.20.0_@types+node@2_0c9e09a0b1912fa528cd2bc14eecd563/node_modules/vitepress-plugin-tabs/dist/index.js
+// ../../node_modules/.pnpm/vitepress-plugin-tabs@0.2.0_vitepress@1.6.3_@algolia+client-search@5.20.0_@types+node@2_89d33a1149fc4afc3a4b1eeb07b93bba/node_modules/vitepress-plugin-tabs/dist/index.js
 var tabsMarker = "=tabs";
 var tabsMarkerLen = tabsMarker.length;
 var ruleBlockTabs = (state, startLine, endLine, silent) => {
@@ -256,7 +256,9 @@ function getMarkdownPlugins(cfg) {
   if (cfg?.timeline !== false) {
     markdownPlugin.push(timeline);
   }
-  markdownPlugin.push(groupIconMdPlugin);
+  if (cfg?.groupIcon !== false) {
+    markdownPlugin.push(groupIconMdPlugin);
+  }
   return markdownPlugin;
 }
 function taskCheckboxPlugin(ops) {
@@ -363,7 +365,7 @@ async function getArticleMeta(filepath, route, timeZone = defaultTimeZoneOffset,
   }
   const utcValue = timeZone >= 0 ? `+${timeZone}` : `${timeZone}`;
   const date = await (meta.date && /* @__PURE__ */ new Date(`${new Date(meta.date).toUTCString()}${utcValue}`) || getFileLastModifyTime(filepath));
-  meta.date = formatDate(date || /* @__PURE__ */ new Date());
+  meta.date = formatDate(date || /* @__PURE__ */ new Date(), "yyyy/MM/dd hh:mm:ss");
   meta.categories = typeof meta.categories === "string" ? [meta.categories] : meta.categories;
   meta.tags = typeof meta.tags === "string" ? [meta.tags] : meta.tags;
   meta.tag = [meta.tag || []].flat().concat([
@@ -534,9 +536,25 @@ function getVitePlugins(cfg = {}) {
   if (cfg?.popover) {
     plugins.push(AnnouncementPlugin(cfg.popover));
   }
-  plugins.push(groupIconVitePlugin(cfg?.groupIcon));
+  if (cfg?.groupIcon !== false) {
+    plugins.push(patchGroupIconPlugin());
+    plugins.push(groupIconVitePlugin(cfg?.groupIcon));
+  }
   return plugins;
 }
+function patchGroupIconPlugin() {
+  return {
+    name: "@sugarat/theme-plugin-patch-group-icon",
+    enforce: "pre",
+    transform(code, id) {
+      if (id.match(/[\/\\]theme[\/\\]index\.(ts|js)$/)) {
+        return `import 'virtual:group-icons.css'
+${code}`;
+      }
+      return code;
+    }
+  };
+}
 function registerVitePlugins(vpCfg, plugins) {
   vpCfg.vite = {
     plugins,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sugarat/theme",
-  "version": "0.5.4",
+  "version": "0.5.6",
   "description": "简约风的 Vitepress 博客主题，sugarat vitepress blog theme",
   "author": "sugar",
   "license": "MIT",
@@ -50,12 +50,12 @@
     "oh-my-live2d": "^0.19.3",
     "swiper": "^11.1.1",
     "vitepress-markdown-timeline": "^1.2.1",
-    "vitepress-plugin-group-icons": "^1.2.4",
+    "vitepress-plugin-group-icons": "1.2.4",
     "vitepress-plugin-mermaid": "2.0.13",
     "vitepress-plugin-tabs": "0.2.0",
-    "@sugarat/theme-shared": "0.0.4",
-    "vitepress-plugin-announcement": "0.1.4",
-    "vitepress-plugin-pagefind": "0.4.13",
+    "@sugarat/theme-shared": "0.0.5",
+    "vitepress-plugin-announcement": "0.1.5",
+    "vitepress-plugin-pagefind": "0.4.14",
     "vitepress-plugin-rss": "0.3.1"
   },
   "devDependencies": {

package/src/components/BlogApp.vue

@@ -3,7 +3,7 @@ import Theme from 'vitepress/theme'
 import { useData } from 'vitepress'
 import { computed } from 'vue'
 import { useDarkTransition } from '../hooks/useDarkTransition'
-import { useBlogThemeMode, useDarkTransitionConfig } from '../composables/config/blog'
+import { useBlogInfoCollapsible, useBlogThemeMode, useDarkTransitionConfig } from '../composables/config/blog'
 import BlogHomeInfo from './BlogHomeInfo.vue'
 import BlogHomeBanner from './BlogHomeBanner.vue'
 import BlogList from './BlogList.vue'
@@ -26,6 +26,8 @@ const layout = computed(() => frontmatter.value.layout)
 const isBlogTheme = useBlogThemeMode()
 const { Layout } = Theme
 
+const blogInfoCollapsible = useBlogInfoCollapsible()
+
 // 切换深色模式过渡
 // https://vitepress.dev/zh/guide/extending-default-theme#on-appearance-toggle
 useDarkTransition()
@@ -67,7 +69,11 @@ const openTransition = useDarkTransitionConfig()
           <div class="blog-list-wrapper">
             <BlogList />
           </div>
-          <div class="blog-info-wrapper">
+          <div
+            :class="{
+              'normal-mode': blogInfoCollapsible,
+            }" class="blog-info-wrapper"
+          >
             <BlogHomeInfo />
           </div>
         </div>
@@ -108,6 +114,9 @@ const openTransition = useDarkTransitionConfig()
       <slot name="nav-screen-content-before" />
     </template>
     <template #nav-screen-content-after>
+      <div v-if="blogInfoCollapsible" class="minify-mode blog-info-wrapper">
+        <BlogHomeInfo />
+      </div>
       <slot name="nav-screen-content-after" />
     </template>
 
@@ -226,6 +235,24 @@ const openTransition = useDarkTransitionConfig()
     margin: 20px 0;
     width: 100%;
   }
+
+  .normal-mode {
+    display: none;
+  }
+
+  .minify-mode {
+    display: block;
+  }
+}
+
+@media screen and (min-width: 768px) {
+  .minify-mode {
+    display: none;
+  }
+
+  .normal-mode {
+    display: block;
+  }
 }
 </style>
 

package/src/components/BlogArticleAnalyze.vue

@@ -131,24 +131,25 @@ const timeTitle = computed(() =>
 <template>
   <div v-if="showAnalyze && readingTimePosition === 'top'" class="doc-analyze" data-pagefind-ignore="all">
     <span>
-      <ElIcon><EditPen /></ElIcon>
+      <ElIcon>
+        <EditPen />
+      </ElIcon>
       {{ topWordCount }}
     </span>
     <span>
-      <ElIcon><AlarmClock /></ElIcon>
+      <ElIcon>
+        <AlarmClock />
+      </ElIcon>
       {{ topReadTime }}
     </span>
   </div>
   <div id="hack-article-des" ref="$des" class="meta-des">
     <!-- TODO：是否需要原创？转载等标签，理论上可以添加标签解决，可以参考 charles7c -->
     <span v-if="author && !hiddenAuthor" class="author" :title="authorTitle">
-      <ElIcon><UserFilled /></ElIcon>
-      <a
-        v-if="currentAuthorInfo"
-        class="link"
-        :href="currentAuthorInfo.url"
-        :title="currentAuthorInfo.des"
-      >
+      <ElIcon>
+        <UserFilled />
+      </ElIcon>
+      <a v-if="currentAuthorInfo" class="link" :href="currentAuthorInfo.url" :title="currentAuthorInfo.des">
         {{ currentAuthorInfo.nickname }}
       </a>
       <template v-else>
@@ -156,36 +157,48 @@ const timeTitle = computed(() =>
       </template>
     </span>
     <span v-if="publishDate && !hiddenTime" class="publishDate" :title="timeTitle + hoverDate">
-      <ElIcon><Clock /></ElIcon>
+      <ElIcon>
+        <Clock />
+      </ElIcon>
       {{ publishDate }}
     </span>
-    <span v-if="tags.length" class="tags" :title="tagTitle">
-      <ElIcon><CollectionTag /></ElIcon>
-      <a v-for="tag in tags" :key="tag" class="link" :href="`/?tag=${tag}`">{{ tag }}
-      </a>
-    </span>
     <template v-if="readingTimePosition === 'inline' && showAnalyze">
       <span :title="wordCountTitle">
-        <ElIcon><EditPen /></ElIcon>
+        <ElIcon>
+          <EditPen />
+        </ElIcon>
         {{ inlineWordCount }}
       </span>
       <span :title="readTimeTitle">
-        <ElIcon><AlarmClock /></ElIcon>
+        <ElIcon>
+          <AlarmClock />
+        </ElIcon>
         {{ inlineReadTime }}
       </span>
     </template>
     <template v-if="readingTimePosition === 'newLine' && showAnalyze">
       <div style="width: 100%;" class="new-line-meta-des">
         <span :title="wordCountTitle">
-          <ElIcon><EditPen /></ElIcon>
+          <ElIcon>
+            <EditPen />
+          </ElIcon>
           {{ inlineWordCount }}
         </span>
         <span :title="readTimeTitle">
-          <ElIcon><AlarmClock /></ElIcon>
+          <ElIcon>
+            <AlarmClock />
+          </ElIcon>
           {{ inlineReadTime }}
         </span>
       </div>
     </template>
+    <span v-if="tags.length" class="tags" :title="tagTitle">
+      <ElIcon>
+        <CollectionTag />
+      </ElIcon>
+      <a v-for="tag in tags" :key="tag" class="link" :href="`/?tag=${tag}`">{{ tag }}
+      </a>
+    </span>
     <!-- 封面展示 -->
     <ClientOnly>
       <BlogDocCover />
@@ -200,26 +213,33 @@ const timeTitle = computed(() =>
   margin-bottom: 20px;
   display: flex;
   justify-content: center;
+
   span {
     margin-right: 16px;
     display: flex;
     align-items: center;
+
     .el-icon {
       margin-right: 4px;
     }
   }
 }
-.meta-des,.new-line-meta-des {
+
+.meta-des,
+.new-line-meta-des {
   text-align: left;
   color: var(--vp-c-text-2);
   font-size: 14px;
   margin-top: 6px;
   display: flex;
   flex-wrap: wrap;
+
   >span {
     margin-right: 16px;
     display: flex;
     align-items: center;
+    flex-wrap: wrap;
+
     .el-icon {
       margin-right: 4px;
     }
@@ -227,12 +247,14 @@ const timeTitle = computed(() =>
 
   .link {
     color: var(--vp-c-text-2);
+
     &:hover {
       color: var(--vp-c-brand-1);
       cursor: pointer;
     }
   }
 }
+
 .tags {
   a.link:not(:last-child) {
     &::after {

package/src/components/BlogCommentWrapper.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import { useElementSize, useElementVisibility, useWindowSize } from '@vueuse/core'
 import { computed, ref } from 'vue'
-import { Comment } from '@element-plus/icons-vue'
 import { useCommentConfig, useOpenCommentConfig } from '../composables/config/blog'
 import Icon from './Icon.vue'
 
@@ -38,7 +37,7 @@ const labelText = computed(() => {
     <div v-show="!commentIsVisible" class="comment-btn-wrapper">
       <span v-if="!mobileMinify && labelText" class="icon-wrapper-text" @click="handleScrollToComment">
         <Icon :size="20" :icon="commentConfig?.icon">
-          <Comment />
+          <svg data-v-f0aeb853="" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 1024 1024"><path fill="currentColor" d="M736 504a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112M128 128v640h192v160l224-160h352V128z" /></svg>
         </Icon>
         <span class="text">
           {{ labelText }}
@@ -46,7 +45,7 @@ const labelText = computed(() => {
       </span>
       <span v-else class="icon-wrapper" @click="handleScrollToComment">
         <Icon :size="20" :icon="commentConfig?.icon">
-          <Comment />
+          <svg data-v-f0aeb853="" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 1024 1024"><path fill="currentColor" d="M736 504a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112m-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112M128 128v640h192v160l224-160h352V128z" /></svg>
         </Icon>
       </span>
     </div>

package/src/components/UserWorks.vue

@@ -213,11 +213,7 @@ function handleChooseTag(tag: string) {
           <!-- times -->
           <div class="times">
             <span class="icon">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                xmlns:xlink="http://www.w3.org/1999/xlink"
-                viewBox="0 0 24 24"
-              >
+              <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24">
                 <title>上线时间</title>
                 <path
                   d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8s8 3.58 8 8s-3.58 8-8 8zm-.22-13h-.06c-.4 0-.72.32-.72.72v4.72c0 .35.18.68.49.86l4.15 2.49c.34.2.78.1.98-.24a.71.71 0 0 0-.25-.99l-3.87-2.3V7.72c0-.4-.32-.72-.72-.72z"
@@ -230,17 +226,10 @@ function handleChooseTag(tag: string) {
           </div>
           <!-- GitHub links -->
           <div v-if="work.github" class="links">
-            <a
-              v-if="work.github"
-              class="github-link"
-              :href="work.github as string"
-              target="_blank"
-              rel="noopener"
-            >
+            <a v-if="work.github" class="github-link" :href="work.github as string" target="_blank" rel="noopener">
               <i class="icon">
                 <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  xmlns:xlink="http://www.w3.org/1999/xlink"
+                  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
                   viewBox="0 0 496 512"
                 >
                   <path
@@ -255,35 +244,16 @@ function handleChooseTag(tag: string) {
           <!-- 其它自定义链接 -->
           <div v-if="work.links?.length" class="links">
             <i v-if="work.links?.length" class="icon">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                xmlns:xlink="http://www.w3.org/1999/xlink"
-                viewBox="0 0 24 24"
-              >
-                <g
-                  fill="none"
-                  stroke="currentColor"
-                  stroke-width="2"
-                  stroke-linecap="round"
-                  stroke-linejoin="round"
-                >
-                  <path
-                    d="M10 14a3.5 3.5 0 0 0 5 0l4-4a3.5 3.5 0 0 0-5-5l-.5.5"
-                  />
-                  <path
-                    d="M14 10a3.5 3.5 0 0 0-5 0l-4 4a3.5 3.5 0 0 0 5 5l.5-.5"
-                  />
+              <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 24 24">
+                <g fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                  <path d="M10 14a3.5 3.5 0 0 0 5 0l4-4a3.5 3.5 0 0 0-5-5l-.5.5" />
+                  <path d="M14 10a3.5 3.5 0 0 0-5 0l-4 4a3.5 3.5 0 0 0 5 5l.5-.5" />
                 </g>
               </svg>
             </i>
             <a
-              v-for="link in work.links || []"
-              :key="link.url"
-              class="link"
-              :href="link.url"
-              :title="link.title"
-              target="_blank"
-              rel="noopener"
+              v-for="link in work.links || []" :key="link.url" class="link" :href="link.url" :title="link.title"
+              target="_blank" rel="noopener"
             >
               {{ link.title }}
             </a>
@@ -291,23 +261,14 @@ function handleChooseTag(tag: string) {
           <!-- tags -->
           <div v-if="work.tags?.length" class="tags">
             <i class="icon">
-              <svg
-                xmlns="http://www.w3.org/2000/svg"
-                viewBox="0 0 1024 1024"
-                data-v-d328c40a=""
-              >
+              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" data-v-d328c40a="">
                 <path
                   fill="currentColor"
                   d="M256 128v698.88l196.032-156.864a96 96 0 0 1 119.936 0L768 826.816V128H256zm-32-64h576a32 32 0 0 1 32 32v797.44a32 32 0 0 1-51.968 24.96L531.968 720a32 32 0 0 0-39.936 0L243.968 918.4A32 32 0 0 1 192 893.44V96a32 32 0 0 1 32-32z"
                 />
               </svg>
             </i>
-            <span
-              v-for="tag in work.tags"
-              :key="tag"
-              class="tag"
-              @click="handleChooseTag(tag)"
-            >{{ tag }}
+            <span v-for="tag in work.tags" :key="tag" class="tag" @click="handleChooseTag(tag)">{{ tag }}
             </span>
           </div>
         </div>
@@ -315,25 +276,11 @@ function handleChooseTag(tag: string) {
         <div v-if="work.covers?.length" class="images">
           <!-- swiper -->
           <div v-if="work.coverLayout === 'swiper'" class="swiper-mode">
-            <ElCarousel
-              autoplay
-              height="260px"
-              :type="isCardMode && work.covers.length >= 3 ? 'card' : ''"
-            >
-              <ElCarouselItem
-                v-for="(url, idx) in work.covers"
-                :key="url"
-                style="text-align: center"
-              >
+            <ElCarousel autoplay height="260px" :type="isCardMode && work.covers.length >= 3 ? 'card' : ''">
+              <ElCarouselItem v-for="(url, idx) in work.covers" :key="url" style="text-align: center">
                 <ElImage
-                  :key="url"
-                  preview-teleported
-                  :src="url"
-                  loading="lazy"
-                  :preview-src-list="work.covers"
-                  :initial-index="idx"
-                  hide-on-click-modal
-                  :alt="`${work.title}-${idx}`"
+                  :key="url" preview-teleported :src="url" loading="lazy" :preview-src-list="work.covers"
+                  :initial-index="idx" hide-on-click-modal :alt="`${work.title}-${idx}`"
                 />
               </ElCarouselItem>
             </ElCarousel>
@@ -341,13 +288,8 @@ function handleChooseTag(tag: string) {
           <!-- list -->
           <div v-if="work.coverLayout === 'list'" class="list-mode">
             <ElImage
-              v-for="(url, idx) in work.covers"
-              :key="url"
-              :src="url"
-              loading="lazy"
-              :preview-src-list="work.covers"
-              :initial-index="idx"
-              hide-on-click-modal
+              v-for="(url, idx) in work.covers" :key="url" :src="url" loading="lazy"
+              :preview-src-list="work.covers" :initial-index="idx" hide-on-click-modal
             />
           </div>
         </div>
@@ -369,24 +311,29 @@ function handleChooseTag(tag: string) {
   width: 100%;
   margin: 20px auto;
   padding: 16px;
+
   h1 {
     font-size: 32px;
     font-weight: bold;
   }
+
   .description {
     margin-top: 16px;
     color: #999;
     font-size: 16px;
   }
+
   a {
     font-weight: 500;
     color: var(--vp-c-brand-1);
   }
 }
+
 .works-container {
   display: flex;
   justify-content: center;
 }
+
 .work {
   max-width: 900px;
 
@@ -396,9 +343,11 @@ function handleChooseTag(tag: string) {
     line-height: 32px;
     font-size: 24px;
     border-top: 1px solid var(--vp-c-divider);
+
     a {
       color: inherit;
     }
+
     &:hover {
       a {
         &::before {
@@ -406,8 +355,10 @@ function handleChooseTag(tag: string) {
         }
       }
     }
+
     a {
       position: relative;
+
       &::before {
         position: absolute;
         left: -16px;
@@ -416,37 +367,44 @@ function handleChooseTag(tag: string) {
       }
     }
   }
+
   h3 {
     margin: 32px 0 0;
     line-height: 28px;
     font-size: 20px;
     position: relative;
-    &.title > a.pin {
+
+    &.title>a.pin {
       position: absolute;
       left: -16px;
+
       &::before {
         left: -16px;
         opacity: 0;
         content: var(--vp-header-anchor-symbol);
       }
     }
-    &:hover > a.pin {
+
+    &:hover>a.pin {
       &::before {
         opacity: 1;
       }
     }
   }
+
   .info {
     display: flex;
     font-size: 14px;
     margin-top: 10px;
     flex-wrap: wrap;
   }
+
   .links,
   .times,
   .tags {
     display: flex;
     align-items: center;
+
     .icon {
       color: var(--vp-c-text-1);
       display: block;
@@ -455,34 +413,42 @@ function handleChooseTag(tag: string) {
       margin-right: 6px;
     }
   }
+
   .times {
     margin-right: 18px;
   }
+
   .links {
     a {
       display: flex;
       align-items: center;
     }
+
     a.github-link {
       margin-right: 10px;
     }
+
     a.link {
       margin-right: 0;
+
       &::after {
         content: ',';
         color: var(--vp-c-text-1);
         margin-right: 6px;
         margin-left: 2px;
       }
+
       &:last-child::after {
         content: '';
       }
     }
   }
+
   .tags {
     span.tag {
       cursor: pointer;
     }
+
     span.tag:not(:last-child) {
       &::after {
         content: '·';
@@ -492,6 +458,21 @@ function handleChooseTag(tag: string) {
     }
   }
 }
+.works {
+  flex: 1;
+}
+@media (min-width: 1440px) {
+  .works {
+    max-width: 784px;
+  }
+}
+
+@media (min-width: 960px) {
+  .works {
+    max-width: 752px;
+  }
+}
+
 .aside-container {
   display: none;
   flex: 1;
@@ -499,18 +480,18 @@ function handleChooseTag(tag: string) {
   width: 100%;
   max-width: 256px;
 }
+
 @media screen and (min-width: 960px) {
   .aside-container {
     display: block;
   }
 }
+
 .aside-outline-container {
   position: sticky;
-  top: calc(
-    var(--vp-nav-height) + var(--vp-layout-top-height, 0px) +
-      var(--vp-doc-top-height, 0px) + 32px
-  );
+  top: calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + var(--vp-doc-top-height, 0px) + 32px);
 }
+
 .lastupdate {
   color: var(--vp-c-text-1);
 }
@@ -522,6 +503,7 @@ function handleChooseTag(tag: string) {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
+
   .el-image {
     :deep(img) {
       object-fit: contain;
@@ -532,6 +514,7 @@ function handleChooseTag(tag: string) {
 
 .swiper-mode {
   margin-top: 16px;
+
   .el-image {
     :deep(img) {
       object-fit: contain;
@@ -539,6 +522,7 @@ function handleChooseTag(tag: string) {
     }
   }
 }
+
 .split {
   display: inline-block;
   width: 1px;

package/src/composables/config/blog.ts

@@ -186,6 +186,10 @@ export function useBlogThemeMode() {
   return inject(configSymbol)!.value?.blog?.blog ?? true
 }
 
+export function useBlogInfoCollapsible() {
+  return inject(configSymbol)!.value?.blog?.home?.blogInfoCollapsible ?? false
+}
+
 export function useArticles() {
   const blogConfig = useConfig()
   const { localeIndex, site } = useData()
@@ -357,7 +361,7 @@ export function useHomeAnalysis() {
 }
 
 export function useAnalyzeTitles(wordCount: Ref<number>, readTime: ComputedRef<number>) {
-  const article = computed(() => useConfig()?.value.blog?.article)
+  const article = useArticleConfig()
 
   const topWordCount = computed(() =>
     replaceValue(article.value?.analyzeTitles?.topWordCount || '字数：{{value}} 个字', wordCount.value)

package/src/composables/config/index.ts

@@ -186,6 +186,11 @@ export namespace Theme {
      * 首页数据分析卡片
      */
     analysis?: HomeAnalysis
+    /**
+     * 首页博客信息卡片是否在移动端折叠展示
+     * @default false
+     */
+    blogInfoCollapsible?: boolean
   }
 
   export interface ArticleConfig {
@@ -450,7 +455,7 @@ export namespace Theme {
 
     /**
      * oh-my-live2d 的 loadOml2d 方法的配置选项
-     * 详见 https://oml2d.com/options/Options.html
+     * 详见 https://oml2d.hacxy.cn/api/interfaces/Options.html
      */
     oml2d?: Oml2dOptions
     homeTags?: boolean | HomeTagsConfig
@@ -467,7 +472,7 @@ export namespace Theme {
     imageStyle?: ImageStyleConfig
     groupIcon?: {
       customIcon: Record<string, string>
-    }
+    } | false
   }
 
   export type FormatShowDate = {

package/src/index.ts

@@ -35,8 +35,8 @@ import UserWorksPage from './components/UserWorks.vue'
 // 内置一些特殊的主题色
 import './styles/theme/inline-theme.var.css'
 
-// 导入group icons
-import 'virtual:group-icons.css'
+// 导入group icons，改由自定义插件导入
+// import 'virtual:group-icons.css'
 
 export const BlogTheme: Theme = {
   ...DefaultTheme,

package/src/utils/node/mdPlugins.ts

@@ -32,7 +32,9 @@ export function getMarkdownPlugins(cfg?: Partial<Theme.BlogConfig>) {
     markdownPlugin.push(timeline)
   }
 
-  markdownPlugin.push(groupIconMdPlugin)
+  if (cfg?.groupIcon !== false) {
+    markdownPlugin.push(groupIconMdPlugin)
+  }
 
   return markdownPlugin
 }

package/src/utils/node/theme.ts

@@ -47,7 +47,7 @@ export async function getArticleMeta(filepath: string, route: string, timeZone =
     || getFileLastModifyTime(filepath)
   )
   // 无法获取时兜底当前时间
-  meta.date = formatDate(date || new Date())
+  meta.date = formatDate(date || new Date(), 'yyyy/MM/dd hh:mm:ss')
 
   // 处理tags和categories,兼容历史文章
   meta.categories

package/src/utils/node/vitePlugins.ts

@@ -56,12 +56,29 @@ export function getVitePlugins(cfg: Partial<Theme.BlogConfig> = {}) {
   }
 
   // 内置支持 group icon
-
-  plugins.push(groupIconVitePlugin(cfg?.groupIcon))
+  if (cfg?.groupIcon !== false) {
+    plugins.push(patchGroupIconPlugin())
+    plugins.push(groupIconVitePlugin(cfg?.groupIcon))
+  }
 
   return plugins
 }
 
+export function patchGroupIconPlugin() {
+  return {
+    name: '@sugarat/theme-plugin-patch-group-icon',
+    enforce: 'pre',
+    transform(code: string, id: string) {
+      // 匹配 theme/index.ts 或 theme/index.js 文件
+      if (id.match(/[\/\\]theme[\/\\]index\.(ts|js)$/)) {
+        // 在文件顶部插入 import 语句
+        return `import 'virtual:group-icons.css'\n${code}`
+      }
+      return code
+    }
+  }
+}
+
 export function registerVitePlugins(vpCfg: any, plugins: any[]) {
   vpCfg.vite = {
     plugins,