From 93182963203139a170fdc09f81e01aaab3ef2b4c Mon Sep 17 00:00:00 2001
From: liuzhihang <liuzhihangs@qq.com>
Date: Sat, 5 Nov 2022 18:24:08 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B9=B6=E6=8E=92=E5=B1=95=E7=A4=BA=E5=A4=9A?=
 =?UTF-8?q?=E4=B8=AA=E5=88=86=E7=B1=BB=E6=A0=87=E7=AD=BE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 templates/assets/zhheo/zhheoblog.css | 29 +++++++++++++++-------------
 templates/modules/post-list.html     | 14 ++++++++------
 2 files changed, 24 insertions(+), 19 deletions(-)

diff --git a/templates/assets/zhheo/zhheoblog.css b/templates/assets/zhheo/zhheoblog.css
index b61daa3d..2440530f 100644
--- a/templates/assets/zhheo/zhheoblog.css
+++ b/templates/assets/zhheo/zhheoblog.css
@@ -9548,23 +9548,27 @@ span.recent-post-top-text {
   margin-top: 20px!important;
 } */
 
-/* 自定义的文章分类 */
-a.article-meta__categories {
+.article-meta__categories {
     position: absolute;
-    padding: 1px 6px;
-    background: var(--heo-black-op);
-    border-radius: 8px;
-    margin-left: 0px;
-    font-size: 12px;
-    font-weight: bold;
-    color: var(--heo-white);
     top: 8px;
     left: 8px;
+}
+
+
+/* 自定义的文章分类 */
+a.article-meta__category {
+    padding: 2px 6px;
+    background: var(--heo-black-op);
+    border-radius: 6px;
+    margin: 0 5px 0 0;
+    font-size: 14px;
+    font-weight: bold;
+    color: var(--heo-white);
     backdrop-filter: saturate(180%) blur(20px);
     -webkit-backdrop-filter: blur(20px);
 }
 
-a.article-meta__categories:hover {
+a.article-meta__category:hover {
     background: var(--heo-theme) !important;
     color: var(--heo-white) !important;
     box-shadow: var(--heo-shadow-theme);
@@ -9705,8 +9709,7 @@ a.article-meta__categories:hover {
 
 .article-meta__tags {
     margin-right: 4px;
-    padding: 0 .2rem;
-    padding-left: 0;
+    padding: 0 0.2rem 0 0;
 }
 
 /* 多分类兼容性调整 */
@@ -10811,7 +10814,7 @@ span.post-meta-position {
 /* 文章信息透明度 */
 .post-meta-wordcount {
     opacity: 0.6;
-    margin-right: 0.8rem;
+
 }
 
 @media screen and (max-width: 768px) {
diff --git a/templates/modules/post-list.html b/templates/modules/post-list.html
index 28220a6d..6534d414 100644
--- a/templates/modules/post-list.html
+++ b/templates/modules/post-list.html
@@ -19,12 +19,14 @@
         </div>
         <!-- 类别非空时 -->
         <th:block th:if="${not #lists.isEmpty(post.categories)}">
-            <a class="article-meta__categories"
-               th:each="category : ${post.categories}"
-               th:href="@{${category.status.permalink}}"
-               th:text="${category.spec.displayName}"
-               th:title="${category.spec.displayName}">
-            </a>
+            <span class="article-meta__categories">
+                <a class="article-meta__category"
+                   th:each="category : ${post.categories}"
+                   th:href="@{${category.status.permalink}}"
+                   th:text="${category.spec.displayName}"
+                   th:title="${category.spec.displayName}">
+                </a>
+            </span>
         </th:block>
         <div class="recent-post-info">
             <div class="recent-post-info-top">