Merge branch 'main'

# Conflicts:
#	CHANGELOG.md
#	README.md

Author: iamStephenFang

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "astro-paper",
-  "version": "4.7.0",
+  "version": "4.8.0",
   "private": false,
   "scripts": {
     "dev": "astro dev",

package.json

@@ -1,10 +1,11 @@
 ---
 export interface Props {
   tag: string;
+  tagName: string;
   size?: "sm" | "lg";
 }
 
-const { tag, size = "sm" } = Astro.props;
+const { tag, tagName, size = "sm" } = Astro.props;
 ---
 
 <li
@@ -24,7 +25,7 @@ const { tag, size = "sm" } = Astro.props;
         d="M16.018 3.815 15.232 8h-4.966l.716-3.815-1.964-.37L8.232 8H4v2h3.857l-.751 4H3v2h3.731l-.714 3.805 1.965.369L8.766 16h4.966l-.714 3.805 1.965.369.783-4.174H20v-2h-3.859l.751-4H21V8h-3.733l.716-3.815-1.965-.37zM14.106 14H9.141l.751-4h4.966l-.752 4z"
       ></path>
     </svg>
-    &nbsp;<span>{tag}</span>
+    &nbsp;<span>{tagName}</span>
   </a>
 </li>
 

src/components/Tag.astro

@@ -125,7 +125,7 @@ iLife 是 Apple 为创意工作者打造的一整套多媒体应用，包括 iPh
 
 如果你和我一样，在学生时代曾使用教育优惠购买过 Apple 的 Pro App 套装，那么你可以直接从 已购列表 中下载到这些专业应用的经典版本，包括 Final Cut Pro 10、Logic Pro X 10、Motion 5 以及 Compressor 4，在 OS X Mavericks 上继续体验 Apple 为创意工作者打造的高端工具。
 
-![](https://image.stephenfang.me/mweb/proimage.stephenfang.me/mweb/image.stephenfang.me/mweb/apps.png)
+![](https://image.stephenfang.me/mweb/apps.png)
 
 Final Cut Pro 对于专业视频编辑工作者来说一定不陌生。虽然 OS X Mavericks 时代的 Final Cut Pro 10 与当前版本在功能和性能上存在差距，但它依然具备直观的界面与强大的非线性编辑能力。尽管缺少现代版本中的 AI 自动剪辑、HDR 处理 等高级功能，但对于基础剪辑需求，它依旧可以高效完成任务，并保持 Apple 一贯流畅的用户体验。
 

src/content/blog/OSXMavericks.md

@@ -94,7 +94,7 @@ const nextPost =
     </article>
 
     <ul class="my-8">
-      {tags.map(tag => <Tag tag={slugifyStr(tag)} />)}
+      {tags.map(tag => <Tag tag={slugifyStr(tag)} tagName={tag} />)}
     </ul>
 
     <div
@@ -141,10 +141,8 @@ const nextPost =
               stroke-linejoin="round"
               class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left flex-none"
             >
-              <>
-                <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-                <path d="M15 6l-6 6l6 6" />
-              </>
+              <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+              <path d="M15 6l-6 6l6 6" />
             </svg>
             <div>
               <span>Previous Post</span>
@@ -175,10 +173,8 @@ const nextPost =
               stroke-linejoin="round"
               class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right flex-none"
             >
-              <>
-                <path stroke="none" d="M0 0h24v24H0z" fill="none" />
-                <path d="M9 6l6 6l-6 6" />
-              </>
+              <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+              <path d="M9 6l6 6l-6 6" />
             </svg>
           </a>
         )

src/layouts/PostDetails.astro

@@ -17,7 +17,7 @@ let tags = getUniqueTags(posts);
   <Header activeNav="tags" />
   <Main pageTitle="Tags" pageDesc="All the tags used in posts.">
     <ul>
-      {tags.map(({ tag }) => <Tag {tag} size="lg" />)}
+      {tags.map(({ tag, tagName }) => <Tag {tag} {tagName} size="lg" />)}
     </ul>
   </Main>
   <Footer />