From 1776f229fc0d9ae936e71d34022facdf7a854a5a Mon Sep 17 00:00:00 2001
From: npmrun <1549469775@qq.com>
Date: Sat, 18 Apr 2026 23:16:00 +0800
Subject: [PATCH] feat(profile): add optional icon support for social links and
 update related components

---
 app/components/PostBodyMarkdownEditor.vue |  23 +-
 app/composables/usePublicHomeLayout.ts    |   2 +-
 app/pages/@[publicSlug]/index.vue         | 441 +++++++++++++++++-------------
 app/pages/me/posts/[id].vue               |  13 +-
 app/pages/me/profile/index.vue            |  12 +-
 app/utils/social-link-icon.ts             |  87 ++++++
 packages/drizzle-pkg/db.sqlite            | Bin 143360 -> 143360 bytes
 server/api/me/profile.put.ts              |   2 +-
 server/service/profile/index.ts           |  17 ++
 9 files changed, 391 insertions(+), 206 deletions(-)
 create mode 100644 app/utils/social-link-icon.ts

diff --git a/app/components/PostBodyMarkdownEditor.vue b/app/components/PostBodyMarkdownEditor.vue
index 7a4bf65..e99df00 100644
--- a/app/components/PostBodyMarkdownEditor.vue
+++ b/app/components/PostBodyMarkdownEditor.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
-import type MarkdownIt from 'markdown-it'
-import { MdEditor } from 'md-editor-v3'
+import { MdEditor, config as mdEditorGlobalConfig } from 'md-editor-v3'
 import 'md-editor-v3/lib/style.css'
 import { attachMarkdownItStripFrontMatter } from '../utils/markdown-front-matter'
 
@@ -15,11 +14,24 @@ const emit = defineEmits<{
 const { fetchData } = useClientApi()
 const toast = useToast()
 const editorId = `post-body-md-${useId()}`
-const previewFmRule = `strip_fm_${useId().replace(/[^a-zA-Z0-9_]/g, '_')}`
 
-function markdownItConfig(md: MarkdownIt) {
-  attachMarkdownItStripFrontMatter(md, previewFmRule)
+/**
+ * md-editor-v3 不会把 `markdown-it-config` 传给内部预览组件；预览用的 MarkdownIt 只读全局 `config()`。
+ * @see node_modules/md-editor-v3/lib/es/MdEditor.mjs — ContentPreview 未转发 markdownItConfig
+ */
+let mdEditorStripFmInstalled = false
+function ensureMdEditorStripFrontMatter() {
+  if (mdEditorStripFmInstalled) {
+    return
+  }
+  mdEditorStripFmInstalled = true
+  mdEditorGlobalConfig({
+    markdownItConfig(md) {
+      attachMarkdownItStripFrontMatter(md, 'person_panel_strip_fm')
+    },
+  })
 }
+ensureMdEditorStripFrontMatter()
 
 const local = computed({
   get: () => props.modelValue,
@@ -53,7 +65,6 @@ async function onUploadImg(files: File[], callback: (urls: string[]) => void) {
       :preview="true"
       preview-theme="github"
       theme="light"
-      :markdown-it-config="markdownItConfig"
       :on-upload-img="onUploadImg"
       :style="{ height: 'min(72vh, 720px)' }"
       class="w-full rounded-lg overflow-hidden ring ring-default"
diff --git a/app/composables/usePublicHomeLayout.ts b/app/composables/usePublicHomeLayout.ts
index 0503c0b..94ee625 100644
--- a/app/composables/usePublicHomeLayout.ts
+++ b/app/composables/usePublicHomeLayout.ts
@@ -8,7 +8,7 @@ export const publicHomeLayoutModeKey: InjectionKey<Ref<PublicHomeLayoutMode>> =
 export function usePublicProfileLayoutMode() {
   const mode = inject(publicHomeLayoutModeKey, null)
   if (!mode) {
-    return { mode: ref<PublicHomeLayoutMode>('showcase') }
+    return { mode: ref<PublicHomeLayoutMode>('detailed') }
   }
   return { mode }
 }
diff --git a/app/pages/@[publicSlug]/index.vue b/app/pages/@[publicSlug]/index.vue
index d0c09bd..b54f219 100644
--- a/app/pages/@[publicSlug]/index.vue
+++ b/app/pages/@[publicSlug]/index.vue
@@ -40,7 +40,7 @@ type PublicRssListItem = { title?: string | null; canonicalUrl?: string | null;
 type Payload = {
   user: { publicSlug: string | null; nickname: string | null; avatar: string | null }
   bio: { markdown: string } | null
-  links: { label: string; url: string; visibility: string }[]
+  links: { label: string; url: string; visibility: string; icon?: string }[]
   posts: { items: PublicPostListItem[]; total: number }
   timeline: { items: PublicTimelineItem[]; total: number }
   rssItems: { items: PublicRssListItem[]; total: number }
@@ -137,7 +137,7 @@ const bioHtml = computed(() => {
   return renderSafeMarkdown(md)
 })
 
-/** 「查看全文」：正文在去掉 FM 后仍有内容时才显示（避免仅有 desc 时链到空页） */
+/** 简介整块可点进 about：去掉 FM 后仍有正文时才包链接（避免仅有 desc 时链到空页） */
 const showBioReadMore = computed(() => {
   const md = data.value?.bio?.markdown
   if (!md?.trim()) {
@@ -155,200 +155,253 @@ const showBioReadMore = computed(() => {
     <UAlert color="error" title="无法加载主页" />
   </UContainer>
 
-  <!-- 展示：居中窄栏，原版卡片 + 时间轴 -->
+  <!-- 展示：居中窄栏，编辑式层级 + 轻量卡片 -->
   <UContainer
     v-else-if="data && mode === 'showcase'"
-    class="py-10 space-y-10 max-w-2xl"
+    class="max-w-2xl py-10 sm:py-14"
   >
-    <div class="flex flex-col gap-2">
-      <div v-if="data.user.avatar" class="flex justify-center">
-        <img
-          :src="data.user.avatar"
-          alt=""
-          class="h-20 w-20 rounded-full object-cover border border-default"
-        >
-      </div>
-      <h1 class="text-2xl font-semibold text-center">
-        {{ data.user.nickname || data.user.publicSlug || slug }}
-      </h1>
-    </div>
+    <div class="mx-auto flex w-full max-w-xl flex-col gap-12 sm:gap-14">
+      <section
+        class="w-full rounded-2xl border border-default/80 bg-elevated/25 px-6 py-8 text-center shadow-sm ring-1 ring-black/5 dark:ring-white/10 sm:px-10 sm:py-9"
+        aria-label="个人资料"
+      >
+        <div class="flex flex-col items-center gap-4">
+          <div v-if="data.user.avatar" class="flex justify-center">
+            <img
+              :src="data.user.avatar"
+              alt=""
+              class="h-24 w-24 rounded-full border-2 border-default object-cover shadow-md ring-4 ring-primary/10"
+            >
+          </div>
+          <div class="space-y-1">
+            <h1 class="text-balance text-2xl font-semibold tracking-tight text-highlighted sm:text-3xl">
+              {{ data.user.nickname || data.user.publicSlug || slug }}
+            </h1>
+            <p
+              v-if="data.user.nickname && data.user.publicSlug"
+              class="text-sm font-medium tabular-nums text-muted"
+            >
+              @{{ data.user.publicSlug }}
+            </p>
+          </div>
+          <ul
+            v-if="data.links.length"
+            class="flex flex-wrap items-center justify-center gap-2.5"
+            aria-label="社交链接"
+          >
+            <li v-for="(l, i) in data.links" :key="i">
+              <a
+                :href="l.url"
+                target="_blank"
+                rel="noopener noreferrer"
+                :title="l.label"
+                :aria-label="`${l.label}（新窗口打开）`"
+                class="flex size-10 items-center justify-center rounded-full border border-default/80 bg-default/40 text-primary transition-colors hover:border-primary/35 hover:bg-elevated focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary"
+              >
+                <UIcon
+                  :name="socialLinkIconName(l)"
+                  class="size-5 shrink-0 opacity-90"
+                />
+              </a>
+            </li>
+          </ul>
+        </div>
+      </section>
 
-    <div v-if="data.bio?.markdown && bioHtml" class="space-y-3">
-      <div
-        class="prose prose-neutral dark:prose-invert max-w-none prose-img:rounded-lg"
-        v-html="bioHtml"
-      />
-      <div v-if="showBioReadMore" class="not-prose">
+      <section
+        v-if="data.bio?.markdown && bioHtml"
+        class="w-full"
+      >
         <NuxtLink
+          v-if="showBioReadMore"
           :to="`/@${slug}/about`"
-          class="text-sm font-medium text-primary hover:underline"
+          class="block rounded-2xl border border-default/70 bg-elevated/20 p-5 transition-colors hover:border-primary/25 hover:bg-elevated/35 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary sm:p-6"
         >
-          查看全文
+          <div
+            class="prose prose-sm prose-neutral max-w-none dark:prose-invert prose-p:leading-relaxed prose-img:rounded-lg"
+            v-html="bioHtml"
+          />
         </NuxtLink>
-      </div>
-    </div>
-
-    <div v-if="data.links.length" class="space-y-2">
-      <h2 class="text-lg font-medium">
-        链接
-      </h2>
-      <ul class="space-y-1">
-        <li v-for="(l, i) in data.links" :key="i">
-          <a
-            :href="l.url"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="text-primary hover:underline"
-          >{{ l.label }}</a>
-        </li>
-      </ul>
-    </div>
-
-    <div v-if="data.posts.total" class="space-y-2">
-      <div class="flex flex-wrap items-center justify-between gap-2">
-        <h2 class="text-lg font-medium">
-          文章
-        </h2>
-        <UButton
-          v-if="data.posts.total > 5"
-          :to="`/@${slug}/posts`"
-          variant="outline"
-          size="xs"
-          icon="i-lucide-arrow-right"
-          trailing
-        >
-          查看全部（共 {{ data.posts.total }} 条）
-        </UButton>
-      </div>
-      <ul class="space-y-2">
-        <li
-          v-for="p in data.posts.items"
-          :key="p.slug"
-          class="border border-default rounded-lg overflow-hidden transition-colors hover:bg-elevated/50"
-        >
-          <NuxtLink
-            :to="`/@${slug}/posts/${encodeURIComponent(p.slug)}`"
-            class="group block p-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-lg"
-          >
-            <time
-              v-if="p.publishedAt"
-              class="block text-xs font-medium tabular-nums text-muted"
-              :datetime="occurredOnToIsoAttr(p.publishedAt)"
-            >{{ formatPublishedDateOnly(p.publishedAt) }}</time>
-            <div class="mt-1 font-medium text-highlighted">
-              {{ p.title }}
-            </div>
-            <div v-if="p.excerpt" class="text-sm text-muted mt-1">
-              {{ p.excerpt }}
-            </div>
-            <div class="mt-1.5 text-sm font-medium text-primary group-hover:underline">
-              查看全文
-            </div>
-          </NuxtLink>
-        </li>
-      </ul>
-    </div>
-
-    <div v-if="data.timeline.total" class="space-y-3">
-      <div class="flex flex-wrap items-center justify-between gap-2">
-        <h2 class="text-lg font-medium text-highlighted">
-          时光机
-        </h2>
-        <UButton
-          v-if="data.timeline.total > 5"
-          :to="`/@${slug}/timeline`"
-          variant="outline"
-          size="xs"
-          icon="i-lucide-arrow-right"
-          trailing
-        >
-          查看全部（共 {{ data.timeline.total }} 条）
-        </UButton>
-      </div>
-      <ul class="relative space-y-0">
-        <li
-          v-for="(e, i) in data.timeline.items"
-          :key="timelineItemKey(e, i)"
-          class="relative flex gap-4 pb-6 pl-1 last:pb-0"
+        <div
+          v-else
+          class="rounded-2xl border border-default/70 bg-elevated/20 p-5 sm:p-6"
         >
           <div
-            v-if="i < data.timeline.items.length - 1"
-            class="absolute left-[11px] top-5 bottom-0 w-px bg-default"
-            aria-hidden="true"
+            class="prose prose-sm prose-neutral max-w-none dark:prose-invert prose-p:leading-relaxed prose-img:rounded-lg"
+            v-html="bioHtml"
           />
-          <div class="relative z-[1] flex shrink-0 flex-col items-center pt-0.5">
-            <span class="size-2.5 rounded-full bg-primary ring-4 ring-primary/15" />
-          </div>
-          <article
-            class="min-w-0 flex-1 rounded-lg border border-default bg-elevated/40 px-3 py-3 shadow-sm"
+        </div>
+      </section>
+
+      <section v-if="data.posts.total" class="w-full space-y-4">
+        <div class="flex flex-wrap items-end justify-between gap-3">
+          <h2 class="text-xs font-semibold uppercase tracking-wider text-muted">
+            文章
+          </h2>
+          <UButton
+            v-if="data.posts.total > 5"
+            :to="`/@${slug}/posts`"
+            variant="outline"
+            size="xs"
+            icon="i-lucide-arrow-right"
+            trailing
+          >
+            查看全部（共 {{ data.posts.total }} 条）
+          </UButton>
+        </div>
+        <ul class="divide-y divide-default overflow-hidden rounded-xl border border-default">
+          <li
+            v-for="p in data.posts.items"
+            :key="p.slug"
+            class="bg-default/30 transition-colors first:rounded-t-xl last:rounded-b-xl hover:bg-elevated/40"
+          >
+            <NuxtLink
+              :to="`/@${slug}/posts/${encodeURIComponent(p.slug)}`"
+              class="group flex cursor-pointer gap-4 p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-primary sm:gap-5"
+            >
+              <div
+                v-if="p.coverUrl"
+                class="relative h-[4.5rem] w-[6.5rem] shrink-0 overflow-hidden rounded-lg border border-default/80"
+              >
+                <img
+                  :src="p.coverUrl"
+                  alt=""
+                  class="size-full object-cover transition-transform duration-300 group-hover:scale-[1.03]"
+                >
+              </div>
+              <div class="min-w-0 flex-1">
+                <time
+                  v-if="p.publishedAt"
+                  class="block text-xs font-medium tabular-nums text-muted"
+                  :datetime="occurredOnToIsoAttr(p.publishedAt)"
+                >{{ formatPublishedDateOnly(p.publishedAt) }}</time>
+                <div class="mt-1 text-pretty font-semibold text-highlighted transition-colors group-hover:text-primary">
+                  {{ p.title }}
+                </div>
+                <p
+                  v-if="p.excerpt"
+                  class="mt-1.5 line-clamp-2 text-sm leading-relaxed text-muted"
+                >
+                  {{ p.excerpt }}
+                </p>
+              </div>
+            </NuxtLink>
+          </li>
+        </ul>
+      </section>
+
+      <section v-if="data.timeline.total" class="w-full space-y-4">
+        <div class="flex flex-wrap items-end justify-between gap-3">
+          <h2 class="text-xs font-semibold uppercase tracking-wider text-muted">
+            时光机
+          </h2>
+          <UButton
+            v-if="data.timeline.total > 5"
+            :to="`/@${slug}/timeline`"
+            variant="outline"
+            size="xs"
+            icon="i-lucide-arrow-right"
+            trailing
+          >
+            查看全部（共 {{ data.timeline.total }} 条）
+          </UButton>
+        </div>
+        <ul class="relative space-y-0">
+          <li
+            v-for="(e, i) in data.timeline.items"
+            :key="timelineItemKey(e, i)"
+            class="relative flex gap-4 pb-8 pl-1 last:pb-0 sm:pb-9"
           >
-            <time
-              class="block text-xs font-medium tabular-nums text-muted"
-              :datetime="e.occurredOn ? occurredOnToIsoAttr(e.occurredOn) : undefined"
-            >{{ formatOccurredOnDisplay(e.occurredOn ?? '') }}</time>
-            <div class="mt-1.5 font-medium text-highlighted">
-              {{ e.title }}
+            <div
+              v-if="i < data.timeline.items.length - 1"
+              class="absolute bottom-0 left-[11px] top-5 w-px bg-default"
+              aria-hidden="true"
+            />
+            <div class="relative z-[1] flex shrink-0 flex-col items-center pt-0.5">
+              <span class="size-2.5 rounded-full bg-primary shadow-sm ring-[6px] ring-primary/12" />
             </div>
+            <article
+              class="min-w-0 flex-1 rounded-xl border border-default/80 bg-elevated/30 px-4 py-4 shadow-sm sm:px-5 sm:py-4"
+            >
+              <div class="flex flex-col gap-1 sm:flex-row sm:items-baseline sm:justify-between sm:gap-3">
+                <h3 class="order-2 text-pretty text-base font-semibold text-highlighted sm:order-1 sm:min-w-0 sm:flex-1">
+                  {{ e.title }}
+                </h3>
+                <time
+                  class="order-1 shrink-0 text-xs font-medium tabular-nums text-muted sm:order-2 sm:text-right"
+                  :datetime="e.occurredOn ? occurredOnToIsoAttr(e.occurredOn) : undefined"
+                >{{ formatOccurredOnDisplay(e.occurredOn ?? '') }}</time>
+              </div>
+              <p
+                v-if="e.bodyMarkdown && e.bodyMarkdown.trim()"
+                class="mt-3 line-clamp-3 border-t border-default/50 pt-3 text-sm leading-relaxed text-muted"
+              >
+                {{ e.bodyMarkdown }}
+              </p>
+              <a
+                v-if="e.linkUrl"
+                :href="e.linkUrl"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="mt-3 inline-flex items-center gap-1 text-sm font-medium text-primary hover:underline"
+              >
+                <span>相关链接</span>
+                <UIcon name="i-lucide-external-link" class="size-3.5 opacity-80" />
+              </a>
+            </article>
+          </li>
+        </ul>
+      </section>
+
+      <section v-if="data.rssItems.total" class="w-full space-y-4">
+        <div class="flex flex-wrap items-end justify-between gap-3">
+          <h2 class="text-xs font-semibold uppercase tracking-wider text-muted">
+            阅读
+          </h2>
+          <UButton
+            v-if="data.rssItems.total > 5"
+            :to="`/@${slug}/reading`"
+            variant="outline"
+            size="xs"
+            icon="i-lucide-arrow-right"
+            trailing
+          >
+            查看全部（共 {{ data.rssItems.total }} 条）
+          </UButton>
+        </div>
+        <ul class="divide-y divide-default overflow-hidden rounded-xl border border-default">
+          <li
+            v-for="(it, i) in data.rssItems.items"
+            :key="i"
+            class="bg-default/30 transition-colors first:rounded-t-xl last:rounded-b-xl hover:bg-elevated/40"
+          >
             <a
-              v-if="e.linkUrl"
-              :href="e.linkUrl"
+              v-if="rssPublicHref(it)"
+              :href="rssPublicHref(it)"
               target="_blank"
               rel="noopener noreferrer"
-              class="mt-2 inline-block text-sm text-primary hover:underline"
-            >相关链接</a>
-          </article>
-        </li>
-      </ul>
-    </div>
-
-    <div v-if="data.rssItems.total" class="space-y-2">
-      <div class="flex flex-wrap items-center justify-between gap-2">
-        <h2 class="text-lg font-medium">
-          阅读
-        </h2>
-        <UButton
-          v-if="data.rssItems.total > 5"
-          :to="`/@${slug}/reading`"
-          variant="outline"
-          size="xs"
-          icon="i-lucide-arrow-right"
-          trailing
-        >
-          查看全部（共 {{ data.rssItems.total }} 条）
-        </UButton>
-      </div>
-      <ul class="space-y-2">
-        <li
-          v-for="(it, i) in data.rssItems.items"
-          :key="i"
-          class="rounded-lg border border-default transition-colors hover:bg-elevated/40"
-        >
-          <a
-            v-if="rssPublicHref(it)"
-            :href="rssPublicHref(it)"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="block p-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary rounded-lg"
-          >
-            <div class="font-medium text-primary">
+              class="group block p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-primary"
+            >
+              <div class="text-pretty font-semibold text-primary transition-colors group-hover:underline">
+                {{ rssPublicTitle(it) }}
+              </div>
+              <div class="mt-1 break-all text-sm text-muted">
+                {{ rssHostname(rssPublicHref(it)) }}
+              </div>
+            </a>
+            <div v-else class="p-4 text-muted">
               {{ rssPublicTitle(it) }}
             </div>
-            <div class="mt-1 text-sm text-muted break-all">
-              {{ rssHostname(rssPublicHref(it)) }}
-            </div>
-          </a>
-          <div v-else class="p-3 text-muted">
-            {{ rssPublicTitle(it) }}
-          </div>
-        </li>
-      </ul>
+          </li>
+        </ul>
+      </section>
+
+      <UEmpty
+        v-if="!data.posts.total && !data.timeline.total && !data.rssItems.total && !data.bio && !data.links.length"
+        title="这里还没有公开内容"
+        description="站主尚未发布任何公开文章或动态。"
+      />
     </div>
-
-    <UEmpty
-      v-if="!data.posts.total && !data.timeline.total && !data.rssItems.total && !data.bio && !data.links.length"
-      title="这里还没有公开内容"
-      description="站主尚未发布任何公开文章或动态。"
-    />
   </UContainer>
 
   <!-- 阅读：侧栏 + 与展示一致的预览块 -->
@@ -371,30 +424,41 @@ const showBioReadMore = computed(() => {
               {{ data.user.nickname || data.user.publicSlug || slug }}
             </h1>
             <div v-if="data.bio?.markdown && bioHtml" class="space-y-2">
-              <div
-                class="bio-preview-scroll max-h-36 overflow-y-auto rounded-lg border border-default bg-elevated/30 p-3 text-xs leading-relaxed text-muted prose prose-neutral dark:prose-invert max-w-none prose-p:my-1 prose-img:rounded"
-                v-html="bioHtml"
-              />
               <NuxtLink
                 v-if="showBioReadMore"
                 :to="`/@${slug}/about`"
-                class="text-xs font-medium text-primary hover:underline"
+                class="block cursor-pointer rounded-lg transition-colors hover:bg-elevated/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary"
               >
-                查看全文
+                <div
+                  class="bio-preview-scroll max-h-36 overflow-y-auto rounded-lg border border-default bg-elevated/30 p-3 text-xs leading-relaxed text-muted prose prose-neutral dark:prose-invert max-w-none prose-p:my-1 prose-img:rounded"
+                  v-html="bioHtml"
+                />
               </NuxtLink>
+              <div
+                v-else
+                class="bio-preview-scroll max-h-36 overflow-y-auto rounded-lg border border-default bg-elevated/30 p-3 text-xs leading-relaxed text-muted prose prose-neutral dark:prose-invert max-w-none prose-p:my-1 prose-img:rounded"
+                v-html="bioHtml"
+              />
             </div>
             <div v-if="data.links.length" class="space-y-1.5">
               <div class="text-xs font-medium uppercase tracking-wide text-muted">
                 链接
               </div>
-              <ul class="space-y-1 text-sm">
+              <ul class="flex flex-col gap-1">
                 <li v-for="(l, i) in data.links" :key="i">
                   <a
                     :href="l.url"
                     target="_blank"
                     rel="noopener noreferrer"
-                    class="text-primary hover:underline break-all"
-                  >{{ l.label }}</a>
+                    class="inline-flex max-w-full items-center gap-1.5 rounded py-0.5 text-xs font-medium text-primary hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary"
+                  >
+                    <UIcon
+                      :name="socialLinkIconName(l)"
+                      class="size-3.5 shrink-0 text-primary opacity-90"
+                      aria-hidden="true"
+                    />
+                    <span class="min-w-0 break-words text-highlighted">{{ l.label }}</span>
+                  </a>
                 </li>
               </ul>
             </div>
@@ -495,7 +559,7 @@ const showBioReadMore = computed(() => {
             >
               <NuxtLink
                 :to="`/@${slug}/posts/${encodeURIComponent(p.slug)}`"
-                class="group flex flex-col gap-4 py-6 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-default rounded-lg sm:flex-row sm:gap-5"
+                class="group flex cursor-pointer flex-col gap-4 py-6 transition-colors hover:bg-elevated/30 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 focus-visible:ring-offset-default rounded-lg sm:flex-row sm:gap-5"
               >
                 <div
                   v-if="p.coverUrl"
@@ -522,9 +586,6 @@ const showBioReadMore = computed(() => {
                   >
                     {{ p.excerpt }}
                   </p>
-                  <p class="mt-2 text-sm font-medium text-primary group-hover:underline">
-                    查看全文
-                  </p>
                 </div>
               </NuxtLink>
             </li>
diff --git a/app/pages/me/posts/[id].vue b/app/pages/me/posts/[id].vue
index 4167712..5389061 100644
--- a/app/pages/me/posts/[id].vue
+++ b/app/pages/me/posts/[id].vue
@@ -28,8 +28,11 @@ const publicPostHref = computed(() => {
   return `/@${ps}/posts/${encodeURIComponent(state.slug)}`
 })
 
-async function load() {
-  loading.value = true
+async function load(options?: { silent?: boolean }) {
+  const silent = options?.silent === true
+  if (!silent) {
+    loading.value = true
+  }
   try {
     const { post: p } = await fetchData<{ post: typeof state }>(`/api/me/posts/${id.value}`)
     Object.assign(state, {
@@ -41,7 +44,9 @@ async function load() {
       shareToken: p.shareToken ?? null,
     })
   } finally {
-    loading.value = false
+    if (!silent) {
+      loading.value = false
+    }
   }
 }
 
@@ -67,7 +72,7 @@ async function save() {
         visibility: state.visibility,
       },
     })
-    await load()
+    await load({ silent: true })
     toast.add({ title: '文章已保存', color: 'success' })
   } finally {
     saving.value = false
diff --git a/app/pages/me/profile/index.vue b/app/pages/me/profile/index.vue
index 1e35277..e94cb27 100644
--- a/app/pages/me/profile/index.vue
+++ b/app/pages/me/profile/index.vue
@@ -14,7 +14,7 @@ type ProfileGet = {
     avatarVisibility: string
     bioMarkdown: string | null
     bioVisibility: string
-    socialLinks: { label: string; url: string; visibility: string }[]
+    socialLinks: { label: string; url: string; visibility: string; icon?: string }[]
     publicSlug: string | null
   }
 }
@@ -166,9 +166,9 @@ onMounted(load)
 async function save() {
   saving.value = true
   try {
-    let links: { label: string; url: string; visibility: string }[] = []
+    let links: { label: string; url: string; visibility: string; icon?: string }[] = []
     try {
-      links = JSON.parse(state.linksJson) as { label: string; url: string; visibility: string }[]
+      links = JSON.parse(state.linksJson) as { label: string; url: string; visibility: string; icon?: string }[]
     } catch {
       toast.add({ title: '社交链接 JSON 无效', color: 'error' })
       return
@@ -337,7 +337,11 @@ async function save() {
           ]"
         />
       </UFormField>
-      <UFormField label="社交链接（JSON 数组）" name="linksJson">
+      <UFormField
+        label="社交链接（JSON 数组）"
+        name="linksJson"
+        description="每条可含可选 icon，须为 Nuxt Icon 全名（小写），如 i-lucide-heart、i-simple-icons-github；省略则按 URL 自动匹配图标。"
+      >
         <UTextarea v-model="state.linksJson" :rows="8" class="w-full font-mono text-sm" />
       </UFormField>
       <UButton type="submit" :loading="saving" :disabled="loading">
diff --git a/app/utils/social-link-icon.ts b/app/utils/social-link-icon.ts
new file mode 100644
index 0000000..8a94bdf
--- /dev/null
+++ b/app/utils/social-link-icon.ts
@@ -0,0 +1,87 @@
+export type SocialLinkIconInput = {
+  label: string
+  url: string
+  icon?: string | null
+}
+
+/** 优先使用条目中的 icon；否则按域名与标题推断 */
+export function socialLinkIconName(link: SocialLinkIconInput): string {
+  const raw = link.icon?.trim()
+  if (raw) {
+    return raw
+  }
+  return inferSocialLinkIconName(link.label, link.url)
+}
+
+function inferSocialLinkIconName(label: string, url: string): string {
+  const lowerLabel = label.toLowerCase()
+
+  try {
+    const u = new URL(url.trim())
+    if (u.protocol === 'mailto:') {
+      return 'i-lucide-mail'
+    }
+    const host = u.hostname.replace(/^www\./i, '').toLowerCase()
+
+    const byHost: [string, string][] = [
+      ['github.com', 'i-simple-icons-github'],
+      ['gist.github.com', 'i-simple-icons-github'],
+      ['github.io', 'i-simple-icons-github'],
+      ['twitter.com', 'i-simple-icons-x'],
+      ['x.com', 'i-simple-icons-x'],
+      ['linkedin.com', 'i-simple-icons-linkedin'],
+      ['youtube.com', 'i-simple-icons-youtube'],
+      ['youtu.be', 'i-simple-icons-youtube'],
+      ['gitlab.com', 'i-simple-icons-gitlab'],
+      ['reddit.com', 'i-simple-icons-reddit'],
+      ['discord.com', 'i-simple-icons-discord'],
+      ['discord.gg', 'i-simple-icons-discord'],
+      ['t.me', 'i-simple-icons-telegram'],
+      ['telegram.org', 'i-simple-icons-telegram'],
+      ['medium.com', 'i-simple-icons-medium'],
+      ['stackoverflow.com', 'i-simple-icons-stackoverflow'],
+      ['bsky.app', 'i-simple-icons-bluesky'],
+      ['mastodon.social', 'i-simple-icons-mastodon'],
+      ['bilibili.com', 'i-simple-icons-bilibili'],
+      ['space.bilibili.com', 'i-simple-icons-bilibili'],
+      ['weibo.com', 'i-simple-icons-sinaweibo'],
+      ['zhihu.com', 'i-simple-icons-zhihu'],
+    ]
+
+    for (const [h, icon] of byHost) {
+      if (host === h || host.endsWith(`.${h}`)) {
+        return icon
+      }
+    }
+
+    if (host.endsWith('.github.io')) {
+      return 'i-simple-icons-github'
+    }
+
+    if (host.includes('mastodon')) {
+      return 'i-simple-icons-mastodon'
+    }
+  }
+  catch {
+    // fall through to label heuristics
+  }
+
+  if (/\bgithub\b/i.test(lowerLabel)) {
+    return 'i-simple-icons-github'
+  }
+  if (/\b(x|twitter)\b/i.test(lowerLabel)) {
+    return 'i-simple-icons-x'
+  }
+  if (/\blinkedin\b/i.test(lowerLabel)) {
+    return 'i-simple-icons-linkedin'
+  }
+  if (/\byoutube\b|\byt\b/i.test(lowerLabel)) {
+    return 'i-simple-icons-youtube'
+  }
+  if (/\bmail\b|邮箱|电子邮件/i.test(lowerLabel)) {
+    return 'i-lucide-mail'
+  }
+
+  return 'i-lucide-link-2'
+}
+
diff --git a/packages/drizzle-pkg/db.sqlite b/packages/drizzle-pkg/db.sqlite
index 15b52ad2201665bb3423535fe4c564a18b5f99aa..be9e14b30584c66ddfd2a8431783a4c930f2dd7e 100644
GIT binary patch
literal 143360
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
DE`m&1

delta 922
zcma)(Pe>F|7{K3~oyi^1`F65x+pKogG9gxXb!KO$gI$CU9%`cqk)YW>%0lY0tE*mg
zyaXY{<_gwfRq_;3S`(R|bg5exPi5dALL}*rbO<y|`)1cD3Zi-M`}pR)@Av(C`ifOw
zv8GFlYX~6~C~g$yR+Yllkm}TpN0FU+uN;uHT1Aa`B(GQXNU|33s3Ar1$aPvE;14N*
zP&h=hFILNEX?Fbe=v-##Ot0lSOd4hG9;m9aT%!LI!FYJ?vW)|sfR11a4)sxyI0zZw
z2*){`4pJ(XYLT{Bd#0zo;mGLvM|bW|3wOp+(VQ7i#8O&kwAt9~;JpUbcU_Ou)Mm$q
z3WN><uOI_W;1<?|`$7k%XcDZa3k1TKIGvgLB}eAw(&7GhTX)obxid!z5jiKOPDWbt
zJCbb4?dB`k=9_01;$5L@v2e}~=5>HG(Gt6J57m+p+$NQ`^5mfZ7dfby<e;LkCTY){
zTwdH?05b%(;1kTl47`O^c!|YMKxSs6(O}cxVS?)JY3ioCuDiN>D9ui=aa$3E1p*7g
zj=9kNvoNyLM~Bbyl!zyAh#bdg+Unf++U?2rQv(~bW364$WGBszWrx@E8mH92^E|QR
zyg05q(H-qdMib^;Ws;68^wU$AW1GM>7KY0Z&o4p+YvC!2q+mhCGZqWa7oxT2_yurH
zi#lC~qd7NVe)<u<82yNi5O@GrvEYkvypbs)e6Wlm#DP!lQxw1K^Q)4C%2QkC^+~>f
zGBQ6&4=RP@34HNh9NoQexv7IS!QWu+U$FB}_;J6K5Ak%0&Vu?^O1~%8rnN?^yQ85v
z)<!D#DhsHxROj_bK3SDy#Vb#LeNGS9=r=>uH$WsT#n~|CG;&?$j~#?#dCHq%%#WhD
VP>vz<0XWuzS5FwL&9Lg5t{)pk2Y~<p

diff --git a/server/api/me/profile.put.ts b/server/api/me/profile.put.ts
index cc6a492..34133a9 100644
--- a/server/api/me/profile.put.ts
+++ b/server/api/me/profile.put.ts
@@ -10,7 +10,7 @@ export default defineWrappedResponseHandler(async (event) => {
     avatarVisibility?: string;
     bioMarkdown?: string | null;
     bioVisibility?: string;
-    socialLinks?: { label: string; url: string; visibility: string }[];
+    socialLinks?: { label: string; url: string; visibility: string; icon?: string }[];
     publicSlug?: string | null;
   }>(event);
 
diff --git a/server/service/profile/index.ts b/server/service/profile/index.ts
index 5ef4a39..0b44330 100644
--- a/server/service/profile/index.ts
+++ b/server/service/profile/index.ts
@@ -11,10 +11,27 @@ const publicSlugValue = z
   .min(3)
   .max(30);
 
+/** Nuxt UI / Iconify icon id, e.g. i-lucide-heart, i-simple-icons-github */
+const socialLinkIconSchema = z.preprocess(
+  (v) => {
+    if (v === "" || v === null || v === undefined) {
+      return undefined;
+    }
+    return typeof v === "string" ? v.trim() : v;
+  },
+  z
+    .string()
+    .min(4)
+    .max(120)
+    .regex(/^i-[a-z0-9]+(?:-[a-z0-9]+)*$/, "icon 须为小写 Nuxt Icon 名，例如 i-lucide-mail")
+    .optional(),
+);
+
 const linkItemSchema = z.object({
   label: z.string().min(1).max(80),
   url: z.string().url().max(2000),
   visibility: visibilitySchema,
+  icon: socialLinkIconSchema.optional(),
 });
 
 export type SocialLinkItem = z.infer<typeof linkItemSchema>;