From 07be173e3800fcdbb4c17a6cde062f2f6b219f7f Mon Sep 17 00:00:00 2001
From: "1152958806@qq.com" <1152958806@qq.com>
Date: Sat, 22 Jul 2023 16:39:22 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E7=89=88=E6=9D=83=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 settings.yaml                                 |  17 +-
 templates/assets/css/post-copyright-one.css   | 307 ++++++++++++++++++
 templates/assets/css/post-copyright.css       | 213 ++++++++++++
 templates/assets/zhheo/zhheoblog.css          | 217 +------------
 templates/modules/post/copyright.html         |  17 +
 .../post/copyright/copyright-default.html     | 105 ++++++
 .../modules/post/copyright/copyright-one.html |  76 +++++
 templates/post.html                           | 100 +-----
 8 files changed, 750 insertions(+), 302 deletions(-)
 create mode 100644 templates/assets/css/post-copyright-one.css
 create mode 100644 templates/assets/css/post-copyright.css
 create mode 100644 templates/modules/post/copyright.html
 create mode 100644 templates/modules/post/copyright/copyright-default.html
 create mode 100644 templates/modules/post/copyright/copyright-one.html

diff --git a/settings.yaml b/settings.yaml
index a14689d2..20da4857 100644
--- a/settings.yaml
+++ b/settings.yaml
@@ -908,7 +908,6 @@ spec:
                       validation: required
                       value: "博客框架为halo2.x"
 
-
     - group: post
       label: 文章
       formSchema:
@@ -1013,6 +1012,22 @@ spec:
               label: 你的博客地址
               help: 注意保留最后的斜杠
               value: https://xx.xx/
+        - $formkit: select
+          name: copyrightsStyle
+          id: copyrightsStyle
+          key: copyrightsStyle
+          label: 版权样式
+          value: default
+          options:
+            - value: default
+              label: 默认
+            - value: one
+              label: 样式一
+        - $formkit: text
+          if: $get(copyrightsStyle).value == 'one'
+          name: desc
+          value: "分享设计与科技生活"
+          label: 版权样式一(描述)
         - $formkit: group
           name: post_edit
           label: 运营模式与责任
diff --git a/templates/assets/css/post-copyright-one.css b/templates/assets/css/post-copyright-one.css
new file mode 100644
index 00000000..04a72cda
--- /dev/null
+++ b/templates/assets/css/post-copyright-one.css
@@ -0,0 +1,307 @@
+
+#post .post-copyright {
+    background: var(--heo-secondbg);
+    border-width: 1px;
+    transition: 0.3s;
+    position: relative;
+    margin: 80px 0px 30px;
+    border-radius: 12px;
+    padding: 34px 0 20px 0;
+    border: var(--style-border-always);
+}
+
+@media screen and (max-width: 768px) {
+    #post .post-copyright {
+        padding: 1rem 1.3rem;
+    }
+}
+
+.post-tools {
+    display: flex;
+    width: 100%;
+    justify-content: center;
+    margin-top: 8px;
+    flex-wrap: wrap;
+    -webkit-user-select: none;
+}
+
+.post-copyright__author_img {
+    width: 66px;
+    height: 66px;
+    margin: auto;
+    border-radius: 66px;
+    overflow: hidden;
+    position: absolute;
+    left: calc(50% - 33px);
+    top: -33px;
+    border: var(--style-border-always);
+    box-shadow: var(--heo-shadow-main);
+}
+
+.post-copyright__author_img img {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+}
+
+
+img.post-copyright__author_img_back {
+    border-radius: 66px;
+    z-index: 10;
+}
+
+img.post-copyright__author_img_front {
+    z-index: 20;
+    transform: scale(1.2) translateY(6px);
+}
+
+.post-copyright__author_img:hover img.post-copyright__author_img_front {
+    transform: scale(1) translateY(3px);
+}
+
+.post-copyright__author_img:hover img.post-copyright__author_img_back {
+    transform: scale(0.8);
+}
+
+.post-copyright__author_name {
+    text-align: center;
+    font-size: 20px;
+    font-weight: bold;
+    margin-top: 16px;
+    color: var(--heo-fontcolor);
+    line-height: 1;
+}
+
+.post-copyright__author_desc {
+    text-align: center;
+    font-size: 14px;
+    color: var(--heo-secondtext);
+    margin-top: 4px;
+}
+
+.post-copyright__author {
+    display: flex;
+    align-items: center;
+}
+
+/* 提示 */
+#post>div.post-copyright>div.post-copyright__notice {
+    font-size: 12px;
+    margin: 0.5rem 0;
+}
+
+#post .post-copyright .post-copyright-info {
+    padding-left: 0;
+    color: var(--heo-secondtext);
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    text-align: center;
+}
+
+
+/* 作者名 */
+#post .post-copyright .post-copyright-info a {
+    padding: 0;
+    color: var(--heo-fontcolor);
+    font-weight: bold;
+}
+
+
+.post-reward {
+    margin-top: 0rem;
+    display: flex;
+    justify-content: center;
+}
+
+/* 打赏作者按钮 */
+.post-reward .reward-button {
+    background: var(--heo-red);
+    color: var(--heo-white);
+    padding: 0 16px;
+    height: 40px;
+    line-height: 39px;
+    box-shadow: var(--heo-shadow-red);
+    display: inline-block;
+    cursor: pointer;
+    transition: all 0.4s ease 0s;
+}
+
+.post-reward:hover .reward-button {
+    color: var(--heo-white);
+    background: var(--heo-theme);
+    box-shadow: none;
+}
+
+.reward-link.mode {
+    background: var(--heo-green);
+    color: var(--heo-white);
+    padding: 0 16px;
+    height: 40px;
+    line-height: 39px;
+    box-shadow: var(--heo-shadow-green);
+    border-radius: 8px;
+    margin-left: 0.5rem;
+    text-align: center;
+    transition: 0.3s;
+}
+
+.reward-link.mode a {
+    color: var(--heo-white);
+}
+
+.reward-link.mode i {
+    margin-right: 4px;
+}
+
+.reward-link.mode:hover {
+    background: var(--heo-theme);
+    box-shadow: none;
+}
+
+/* 捐助工具栏 */
+.post-tools-left {
+    white-space: nowrap;
+    display: flex;
+    text-overflow: ellipsis;
+    flex-wrap: wrap;
+}
+
+.post-tools-right {
+    padding-right: 0px;
+    display: flex;
+    align-items: center;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+
+@media screen and (max-width: 768px) {
+
+    .post-tools-left>div {
+        margin: 8px;
+    }
+
+    .post-tools-left {
+        white-space: nowrap;
+        display: flex;
+        text-overflow: ellipsis;
+        justify-content: center;
+        width: 100%;
+    }
+
+    .post-tools-right {
+        margin-top: 1rem;
+        width: 100%;
+        justify-content: center;
+    }
+}
+
+#post .post-copyright .post-copyright-info a:hover {
+    text-decoration: none;
+    background-color: var(--heo-main);
+    color: var(--heo-white);
+    cursor: pointer;
+    border-radius: 4px;
+}
+
+#post .tag_share .post-meta__tag-list {
+    display: flex;
+    padding: 0;
+    width: 100%;
+    flex-wrap: wrap;
+    flex-direction: row;
+}
+
+#post .tag_share .post-meta__tag-list a {
+    margin-bottom: 8px;
+    margin-right: 8px;
+}
+
+/* 文章标签 */
+#post .tag_share .post-meta__tags {
+    background: var(--heo-card-bg);
+    border: var(--style-border-always);
+    color: var(--heo-fontcolor);
+    border-radius: 8px;
+    margin: 0;
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    height: 40px;
+    padding: 0px 0.6rem;
+    width: fit-content;
+    font-size: 0.85em;
+    transition: all 0.2s ease-in-out 0s;
+}
+
+#post .tag_share .post-meta__tags:hover {
+    background: var(--heo-lighttext);
+    box-shadow: var(--heo-shadow-main);
+    color: var(--heo-white);
+}
+
+@media screen and (min-width: 1300px) {
+    #post .tag_share .post-meta__tags {
+        background: var(--heo-card-bg);
+        border: var(--style-border);
+    }
+
+    #post .tag_share .post-meta__tags:hover {
+        border: var(--style-border-hover);
+    }
+}
+
+@media screen and (max-width: 768px) {
+    #post .post-copyright {
+        background: var(--heo-card-bg);
+        box-shadow: var(--heo-shadow-border);
+    }
+
+    .post-copyright .post-meta-original {
+        display: none;
+    }
+
+    .post-copyright__original {
+        display: none;
+    }
+}
+
+@media screen and (max-width: 768px) {
+    #post>div.post-copyright>div.post-copyright__author>span>span {
+        -webkit-line-clamp: 3;
+    }
+
+    #post .post-copyright .post-copyright-info {
+        -webkit-line-clamp: 2;
+    }
+
+    #post .post-copyright .post-copyright-title {
+        -webkit-line-clamp: 3;
+        line-height: 1.2;
+    }
+}
+
+.post-reward .reward-main {
+    left: -96px;
+    width: fit-content;
+}
+
+@media screen and (max-width: 768px) {
+    .post-reward .reward-main {
+        justify-content: center !important;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        z-index: 102;
+        width: 100%;
+        margin: auto;
+        padding: 0;
+    }
+}
+
+.post-reward .reward-main .reward-all {
+    background:var(--heo-card-bg);
+}
+
diff --git a/templates/assets/css/post-copyright.css b/templates/assets/css/post-copyright.css
new file mode 100644
index 00000000..512c7406
--- /dev/null
+++ b/templates/assets/css/post-copyright.css
@@ -0,0 +1,213 @@
+/* 版权信息 */
+/* 背景 */
+#post .post-copyright {
+    background: var(--heo-card-bg);
+    padding: 1rem 1.3rem;
+    overflow: hidden;
+    border: var(--style-border);
+    border-width: 1px;
+    transition: 0.3s;
+    position: relative;
+    margin: 1.8rem 0px 0.5rem;
+    border-radius: 12px;
+}
+
+#post .post-copyright:after {
+    position: absolute;
+    right: 22px;
+    top: -77px;
+    content: "\f25e";
+    font-size: 180px;
+    font-family: "Font Awesome 5 Brands";
+    color: var(--heo-fontcolor);
+    opacity: 0.1;
+    filter: blur(7px);
+}
+
+@media screen and (max-width: 768px) {
+    #post .post-copyright {
+        padding: 1rem 1.3rem;
+    }
+}
+
+.post-tools {
+    display: flex;
+    width: 100%;
+    justify-content: space-between;
+    margin-top: 2rem;
+    flex-wrap: wrap;
+}
+
+/* 捐助工具栏 */
+.post-tools-left {
+    white-space: nowrap;
+    display: flex;
+    text-overflow: ellipsis;
+    flex-wrap: wrap;
+    margin-bottom: 0.5rem;
+}
+
+.post-tools-right {
+    overflow: scroll;
+    overflow-x: overlay;
+    padding-right: 0px;
+    display: flex;
+    align-items: center;
+    margin-bottom: 0.5rem;
+}
+
+@media screen and (max-width: 768px) {
+
+    .post-tools-left > div {
+        margin: 8px;
+    }
+
+    .post-tools-left {
+        white-space: nowrap;
+        display: flex;
+        text-overflow: ellipsis;
+        margin-top: 1rem;
+        justify-content: center;
+        width: 100%;
+    }
+
+    .post-tools-right {
+        margin-top: 1rem;
+        width: 100%;
+        justify-content: center;
+    }
+}
+
+.reward-link.mode {
+    background: var(--heo-green);
+    color: var(--heo-white);
+    padding: 0;
+    width: 173px;
+    height: 40px;
+    line-height: 39px;
+    box-shadow: var(--heo-shadow-green);
+    border-radius: 8px;
+    margin-left: 0.5rem;
+    text-align: center;
+    transition: 0.3s;
+}
+
+@media screen and (min-width: 1300px) {
+    .reward-link.mode:hover {
+        transform: scale(1.03);
+    }
+
+    .reward-link.mode:active {
+        transform: scale(0.97);
+    }
+}
+
+
+.reward-link.mode a {
+    color: var(--heo-white);
+}
+
+.reward-link.mode i {
+    margin-right: 4px;
+}
+
+.reward-link.mode:hover {
+    background: var(--heo-theme);
+    box-shadow: none;
+}
+
+.post-reward .reward-button {
+    display: inline-block;
+    padding: 0.2rem 1.2rem;
+    background: var(--btn-bg);
+    color: var(--btn-color);
+    cursor: pointer;
+    transition: all 0.4s ease 0s;
+    border-radius: 5px;
+}
+
+/* 赞赏作者按钮 */
+.post-reward .reward-button {
+    background: var(--heo-red);
+    color: var(--heo-white);
+    padding: 0;
+    width: 133px;
+    height: 40px;
+    line-height: 39px;
+    box-shadow: var(--heo-shadow-red);
+}
+
+#post .post-copyright .post-copyright-info a:hover {
+    text-decoration: none;
+    background-color: rgb(255, 255, 255);
+    color: rgb(59, 130, 255);
+    cursor: pointer;
+    border-radius: 4px;
+}
+
+/* 标签列表页 */
+
+#post .tag_share .post-meta__tag-list {
+    display: flex;
+}
+
+@media screen and (max-width: 768px) {
+    #post .tag_share .post-meta__tag-list {
+        display: flex;
+        overflow: scroll;
+        position: absolute;
+        left: 0;
+        padding: 0 20px 0 20px;
+        width: 100%;
+    }
+}
+
+#post .tag_share .post-meta__tags:not(:last-child) {
+    margin: 0 0.5rem 0 0;
+}
+
+
+/* 提示 */
+#post > div.post-copyright > div.post-copyright__notice {
+    font-size: 0.7rem;
+    line-height: 1rem;
+    margin: 0.5rem 0;
+}
+
+/* 作者名 */
+#post .post-copyright .post-copyright-info a {
+    padding: 0;
+    color: var(--heo-fontcolor);
+    font-weight: bold;
+}
+
+#post .post-copyright .post-copyright-info a:hover {
+    color: var(--heo-lighttext);
+}
+
+#post .post-copyright .post-copyright-info {
+    padding-left: 0;
+    color: var(--heo-fontcolor);
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+}
+
+@media screen and (max-width: 768px) {
+    .post-reward .reward-main {
+        justify-content: center !important;
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        z-index: 102;
+        width: 100%;
+        margin: auto;
+        padding: 0;
+    }
+}
+
+.post-reward .reward-main .reward-all {
+    background:var(--heo-card-bg);
+}
diff --git a/templates/assets/zhheo/zhheoblog.css b/templates/assets/zhheo/zhheoblog.css
index 4c5d53cb..47f2580b 100644
--- a/templates/assets/zhheo/zhheoblog.css
+++ b/templates/assets/zhheo/zhheoblog.css
@@ -44,7 +44,7 @@
     --heo-blue: #425AEF;
     --heo-red: #f04a63;
     --heo-pink: #FF7C7C;
-    --heo-green: #28a63f;
+    --heo-green: #57bd6a;
     --heo-yellow: #c28b00;
     --heo-yellow-op: #d99c001a;
     --heo-orange: #e38100;
@@ -61,7 +61,7 @@
     --heo-card-btn-bg: #edf0f7;
     --heo-post-blockquote-bg: #fafcff;
     --heo-post-tabs-bg: #f2f5f8;
-    --heo-secondbg: #f1f3f8;
+    --heo-secondbg: #f7f7f9;
     --heo-shadow-nav: 0 5px 12px -5px rgba(102, 68, 68, 0.05);
     --heo-card-bg: #fff;
     --heo-card-bg-op: var(--heo-black-op);
@@ -3515,9 +3515,7 @@ ul {
     margin-bottom: 0px !important;
 }
 
-#post .tag_share .post-meta__tag-list {
-    display: inline-block;
-}
+
 
 #post .tag_share .post-meta__tags {
     display: inline-block;
@@ -3583,13 +3581,7 @@ ul {
     border-radius: 4px;
 }
 
-#post .post-copyright .post-copyright-info a:hover {
-    text-decoration: none;
-    background-color: rgb(255, 255, 255);
-    color: rgb(59, 130, 255);
-    cursor: pointer;
-    border-radius: 4px;
-}
+
 
 #post .post-outdate-notice {
     position: relative;
@@ -3686,15 +3678,7 @@ ul {
     text-align: center;
 }
 
-.post-reward .reward-button {
-    display: inline-block;
-    padding: 0.2rem 1.2rem;
-    background: var(--btn-bg);
-    color: var(--btn-color);
-    cursor: pointer;
-    transition: all 0.4s ease 0s;
-    border-radius: 5px;
-}
+
 
 .post-reward:hover > .reward-main {
     display: block;
@@ -12099,9 +12083,7 @@ blockquote p {
     height: 34px;
 }
 
-#post .tag_share .post-meta__tags:not(:last-child) {
-    margin: 0 0.5rem 0 0;
-}
+
 
 #post .tag_share .post-meta__tags:hover {
     background: var(--heo-lighttext);
@@ -12120,37 +12102,7 @@ blockquote p {
     }
 }
 
-/* 版权信息 */
-/* 背景 */
-#post .post-copyright {
-    background: var(--heo-card-bg);
-    padding: 1rem 1.3rem;
-    overflow: hidden;
-    border: var(--style-border);
-    border-width: 1px;
-    transition: 0.3s;
-    position: relative;
-    margin: 1.5rem 0px 0.5rem;
-    border-radius: 12px;
-}
 
-#post .post-copyright:after {
-    position: absolute;
-    right: 22px;
-    top: -77px;
-    content: "\f25e";
-    font-size: 180px;
-    font-family: "Font Awesome 5 Brands";
-    color: var(--heo-fontcolor);
-    opacity: 0.1;
-    filter: blur(7px);
-}
-
-@media screen and (max-width: 768px) {
-    #post .post-copyright {
-        padding: 1rem 1.3rem;
-    }
-}
 
 .post-copyright__author {
     display: flex;
@@ -12205,29 +12157,12 @@ blockquote p {
     transition: 0.3s;
 }
 
-/* 作者名 */
-#post .post-copyright .post-copyright-info a {
-    padding: 0;
-    color: var(--heo-fontcolor);
-    font-weight: bold;
-}
+
 
 #post .post-copyright .post-copyright__notice .post-copyright-info a {
     padding: 0 4px;
 }
 
-#post .post-copyright .post-copyright-info a:hover {
-    color: var(--heo-lighttext);
-}
-
-#post .post-copyright .post-copyright-info {
-    padding-left: 0;
-    color: var(--heo-fontcolor);
-    overflow: hidden;
-    display: -webkit-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-}
 
 #post .post-copyright .post-copyright-title {
     padding-left: 0;
@@ -12296,28 +12231,11 @@ blockquote p {
     -webkit-box-orient: vertical;
 }
 
-/* 提示 */
-#post > div.post-copyright > div.post-copyright__notice {
-    font-size: 0.7rem;
-    line-height: 1rem;
-    margin: 0.5rem 0;
-}
-
 /* 装饰圈 */
 #post .post-copyright:before {
     display: none;
 }
 
-/* 赞赏作者按钮 */
-.post-reward .reward-button {
-    background: var(--heo-red);
-    color: var(--heo-white);
-    padding: 0;
-    width: 133px;
-    height: 40px;
-    line-height: 39px;
-    box-shadow: var(--heo-shadow-red);
-}
 
 .post-reward:hover .reward-button {
     color: var(--heo-white);
@@ -12389,43 +12307,7 @@ a.reward-main-btn:hover {
     color: var(--heo-red);
 }
 
-.reward-link.mode {
-    background: var(--heo-green);
-    color: var(--heo-white);
-    padding: 0;
-    width: 173px;
-    height: 40px;
-    line-height: 39px;
-    box-shadow: var(--heo-shadow-green);
-    border-radius: 8px;
-    margin-left: 0.5rem;
-    text-align: center;
-    transition: 0.3s;
-}
 
-@media screen and (min-width: 1300px) {
-    .reward-link.mode:hover {
-        transform: scale(1.03);
-    }
-
-    .reward-link.mode:active {
-        transform: scale(0.97);
-    }
-}
-
-
-.reward-link.mode a {
-    color: var(--heo-white);
-}
-
-.reward-link.mode i {
-    margin-right: 4px;
-}
-
-.reward-link.mode:hover {
-    background: var(--heo-theme);
-    box-shadow: none;
-}
 
 /* 赞赏背景 */
 
@@ -13593,13 +13475,7 @@ button.el-button.tk-cancel.el-button--default.el-button--small {
     }
 }
 
-.post-tools {
-    display: flex;
-    width: 100%;
-    justify-content: space-between;
-    margin-top: 2rem;
-    flex-wrap: wrap;
-}
+
 
 .post-reward {
     margin-top: 0rem;
@@ -13623,17 +13499,6 @@ button.el-button.tk-cancel.el-button--default.el-button--small {
 }
 
 @media screen and (max-width: 768px) {
-    .post-reward .reward-main {
-        justify-content: center !important;
-        position: fixed;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        z-index: 102;
-        width: 100%;
-        margin: auto;
-        padding: 0;
-    }
 
     .post-reward .reward-main .reward-all {
         width: 100%;
@@ -13675,45 +13540,7 @@ button.el-button.tk-cancel.el-button--default.el-button--small {
     }
 }
 
-/* 捐助工具栏 */
-.post-tools-left {
-    white-space: nowrap;
-    display: flex;
-    text-overflow: ellipsis;
-    flex-wrap: wrap;
-    margin-bottom: 0.5rem;
-}
 
-.post-tools-right {
-    overflow: scroll;
-    overflow-x: overlay;
-    padding-right: 0px;
-    display: flex;
-    align-items: center;
-    margin-bottom: 0.5rem;
-}
-
-@media screen and (max-width: 768px) {
-
-    .post-tools-left > div {
-        margin: 8px;
-    }
-
-    .post-tools-left {
-        white-space: nowrap;
-        display: flex;
-        text-overflow: ellipsis;
-        margin-top: 1rem;
-        justify-content: center;
-        width: 100%;
-    }
-
-    .post-tools-right {
-        margin-top: 1rem;
-        width: 100%;
-        justify-content: center;
-    }
-}
 
 .post-reward .reward-main .reward-all:after {
     display: none;
@@ -13980,22 +13807,7 @@ button.el-button.tk-cancel.el-button--default.el-button--small {
     }
 }
 
-/* 标签列表页 */
 
-#post .tag_share .post-meta__tag-list {
-    display: flex;
-}
-
-@media screen and (max-width: 768px) {
-    #post .tag_share .post-meta__tag-list {
-        display: flex;
-        overflow: scroll;
-        position: absolute;
-        left: 0;
-        padding: 0 20px 0 20px;
-        width: 100%;
-    }
-}
 
 #page .tag-cloud-list a {
     color: var(--heo-fontcolor) !important;
@@ -14018,7 +13830,7 @@ button.el-button.tk-cancel.el-button--default.el-button--small {
 }
 
 span.tagsPageCount {
-    background: var(--heo-card-bg);
+    background: var(--heo-secondbg);
     padding: 4px 4px;
     border-radius: 8px;
     color: var(--heo-secondtext);
@@ -14027,16 +13839,16 @@ span.tagsPageCount {
     min-width: 35px;
     display: inline-block;
     font-size: 1rem;
+    margin-left: 4px;
 }
 
 #page .tag-cloud-list a:hover span.tagsPageCount {
     color: var(--heo-lighttext);
 }
 
-#tag-page-tags .tagsPageCount,
-#post .tag_share .post-meta__tags span.tagsPageCount {
-    padding: 2px 4px;
-    background: var(--heo-secondbg);
+#tag-page-tags .tagsPageCount, #post .tag_share .post-meta__tags span.tagsPageCount {
+    padding: 2px;
+    background: var(--heo-card-bg);
     border: var(--style-border-always);
     min-width: 22.5px;
     display: inline-block;
@@ -14047,9 +13859,8 @@ span.tagsPageCount {
     margin-left: 4px;
 }
 
-#tag #tag-page-tags a:hover .tagsPageCount,
+
 #post .tag_share .post-meta__tags:hover span.tagsPageCount {
-    background: var(--heo-card-bg);
     color: var(--heo-lighttext);
 }
 
diff --git a/templates/modules/post/copyright.html b/templates/modules/post/copyright.html
new file mode 100644
index 00000000..bf74a402
--- /dev/null
+++ b/templates/modules/post/copyright.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<!-- 版权声明 -->
+<th:block th:fragment="copyright">
+
+
+    <!-- 默认样式 -->
+    <th:block th:replace="~{modules/post/copyright/copyright-default :: copyright-default}"></th:block>
+
+    <!-- 样式一 -->
+    <th:block th:replace="~{modules/post/copyright/copyright-one :: copyright-one}"></th:block>
+
+
+</th:block>
+
+
+</html>
\ No newline at end of file
diff --git a/templates/modules/post/copyright/copyright-default.html b/templates/modules/post/copyright/copyright-default.html
new file mode 100644
index 00000000..0fdc2188
--- /dev/null
+++ b/templates/modules/post/copyright/copyright-default.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<!-- 版权样式默认 -->
+<th:block th:fragment="copyright-default" th:if="${#strings.equals(theme.config.post.copyrightsStyle, 'default')}">
+    <div class="post-tools" id="post-tools">
+        <div class="post-tools-left">
+
+            <!-- 打赏 -->
+            <div th:if="${theme.config.aboutReward.reward.enable_reward_wz}" class="post-reward"
+                 onclick="AddRewardMask()">
+                <div class="reward-button button&#45;&#45;animated" title="赞赏作者"><i class="fas fa-hamburger"></i>
+                    打赏作者
+                </div>
+                <div class="reward-main">
+                    <ul class="reward-all"><span class="reward-title">感谢你赐予我前进的力量</span>
+                        <ul class="reward-group">
+                            <li class="reward-item"><a th:href="@{${theme.config.aboutReward.reward.wxPay}}"
+                                                       target="_blank">
+                                <img alt="微信" class="post-qr-code-img"
+                                     th:src="${theme.config.aboutReward.reward.wxPay}"></a>
+                                <div class="post-qr-code-desc">微信</div>
+                            </li>
+                            <li class="reward-item"><a th:href="@{${theme.config.aboutReward.reward.alipay}}"
+                                                       target="_blank"><img alt="支付宝" class="post-qr-code-img"
+                                                                            th:src="${theme.config.aboutReward.reward.alipay}"></a>
+                                <div class="post-qr-code-desc">支付宝</div>
+                            </li>
+                        </ul>
+                        <a class="reward-main-btn" th:href="@{${theme.config.aboutReward.reward.reward_md_url}}"
+                           target="_blank">
+                            <div class="reward-text">赞赏者名单</div>
+                            <div class="reward-dec">因为你们的支持让我意识到写文章的价值🙏</div>
+                        </a>
+                    </ul>
+                </div>
+            </div>
+
+            <!-- 说明 -->
+            <div th:if="${theme.config.post.post_edit.enable_post_edit}" class="reward-link mode"><a
+                    class="reward-link-button" th:href="@{${theme.config.post.post_edit.post_edit_url}}">
+                <i class="fas fa-seedling"></i>运营模式与责任</a>
+            </div>
+
+            <!-- 分享 -->
+            <div class="share-link mobile">
+                <div class="share-qrcode">
+                    <div class="share-button" title="使用手机访问这篇文章"><i class="iconfont icon-qrcode"></i>
+                    </div>
+                    <div class="share-main">
+                        <div class="share-main-all">
+                            <div id="qrcode"></div>
+                            <div class="reward-dec">使用手机访问这篇文章</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="share-link weibo">
+                <a class="share-button" rel="noopener external nofollow noreferrer noopener" target="_blank"
+                   th:href="'https://service.weibo.com/share/share.php?title=' + ${post.spec.title}" title="分享到微博">
+                    <i class="iconfont icon-weibo" style="font-size:22px"></i></a>
+            </div>
+            <div class="share-link copyurl">
+                <div class="share-button" id="post-share-url" onclick="rm.copyPageUrl()" title="复制链接"><i
+                        class="iconfont icon-link"></i></div>
+            </div>
+        </div>
+        <div class="post-tools-right">
+            <div class="tag_share">
+                <div class="post-meta__tag-list">
+                    <a class="post-meta__tags" th:each="tag : ${post.tags}" th:href="@{${tag.status.permalink}}">
+                        <span class="tags-punctuation">[[${tag.spec.displayName}]]</span>
+
+                        <span class="tagsPageCount" th:text="${tag.status.visiblePostCount}"></span>
+                    </a>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- 版权声明 -->
+    <div class="post-copyright" th:if="${theme.config.post.copyrights.enable}">
+        <div class="post-copyright__author">
+            <!-- 版权页 以及版权描述文字 -->
+            <a class="post-copyright__original" th:href="@{${theme.config.basics.copyrightAgreement}}"
+               title="该文章为原创文章，注意版权协议">原创</a>
+            <a class="post-copyright-title" href="#"><span th:text="${post.spec.title}"></span></a>
+        </div>
+        <div class="post-copyright__type">
+            <span class="post-copyright-info" id="post-copyright-url">
+                <a href="javascript:window.location.href;">[[${post.spec.title}]]</a>
+            </span>
+            <button class="post-copyright-copybtn" onclick="rm.copyPageUrl()">
+                <i class="iconfont icon-paste"></i>
+            </button>
+        </div>
+        <div class="post-copyright__notice">
+            <span class="post-copyright-info" th:utext="${theme.config.post.copyrights.content}"></span>
+        </div>
+    </div>
+
+    <link rel="stylesheet" th:href="${assets_link + '/css/post-copyright.css'}">
+</th:block>
+
+
+</html>
\ No newline at end of file
diff --git a/templates/modules/post/copyright/copyright-one.html b/templates/modules/post/copyright/copyright-one.html
new file mode 100644
index 00000000..a1d836ac
--- /dev/null
+++ b/templates/modules/post/copyright/copyright-one.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<!-- 版权样式一 -->
+<th:block th:fragment="copyright-one" th:if="${#strings.equals(theme.config.post.copyrightsStyle, 'one')}">
+    <!-- 版权声明 -->
+    <div class="post-copyright">
+        <div class="post-copyright__author_group"><a class="post-copyright__author_img" href="/about"
+                                                     data-pjax-state="">
+            <img class="post-copyright__author_img_back entered loading"
+                 th:src="@{${#strings.isEmpty(site.logo) ?  assets_link + '/images/hao-logo.jpg' : site.logo}}"
+            ></a>
+            <div class="post-copyright__author_name">[[${site.title}]]</div>
+            <div class="post-copyright__author_desc">[[${theme.config.post.desc}]]</div>
+        </div>
+        <div class="post-tools" id="post-tools">
+            <div class="post-tools-left">
+                <div th:if="${theme.config.aboutReward.reward.enable_reward_wz}" class="post-reward"
+                     onclick="AddRewardMask()">
+                    <div class="reward-button button--animated" title="打赏作者"><i
+                            class="fas fa-hamburger"></i> 打赏作者</div>
+                    <div class="reward-main">
+                        <ul class="reward-all"><span class="reward-title">感谢你赐予我前进的力量</span>
+                            <ul class="reward-group">
+                                <li class="reward-item"><a
+                                        th:href="@{${theme.config.aboutReward.reward.wxPay}}"
+                                        target="_blank">
+                                    <img alt="微信" class="post-qr-code-img"
+                                         th:src="${theme.config.aboutReward.reward.wxPay}"></a>
+                                    <div class="post-qr-code-desc">微信</div>
+                                </li>
+                                <li class="reward-item"><a
+                                        th:href="@{${theme.config.aboutReward.reward.alipay}}"
+                                        target="_blank"><img alt="支付宝" class="post-qr-code-img"
+                                                             th:src="${theme.config.aboutReward.reward.alipay}"></a>
+                                    <div class="post-qr-code-desc">支付宝</div>
+                                </li>
+                            </ul>
+                            <a class="reward-main-btn"
+                               th:href="@{${theme.config.aboutReward.reward.reward_md_url}}"
+                               target="_blank">
+                                <div class="reward-text">赞赏者名单</div>
+                                <div class="reward-dec">因为你们的支持让我意识到写文章的价值🙏</div>
+                            </a>
+                        </ul>
+                    </div>
+                </div>
+                <div th:if="${theme.config.post.post_edit.enable_post_edit}" class="reward-link mode"><a
+                        class="reward-link-button" th:href="@{${theme.config.post.post_edit.post_edit_url}}"
+                        data-pjax-state=""><i class="fas fa-seedling"></i>订阅</a></div>
+            </div>
+        </div>
+        <div
+                th:if="${theme.config.post.copyrights.enable}"
+                class="post-copyright__notice">
+            <span class="post-copyright-info" th:utext="${theme.config.post.copyrights.content}"></span>
+        </div>
+
+
+    </div>
+    <div class="post-tools-right">
+        <div class="tag_share">
+            <div class="post-meta__tag-list">
+                <a class="post-meta__tags" th:each="tag : ${post.tags}" th:href="@{${tag.status.permalink}}">
+                    <span class="tags-punctuation">[[${tag.spec.displayName}]]</span>
+
+                    <span class="tagsPageCount" th:text="${tag.status.visiblePostCount}"></span>
+                </a>
+            </div>
+        </div>
+    </div>
+    <link rel="stylesheet" th:href="${assets_link + '/css/post-copyright-one.css'}">
+</th:block>
+
+
+
+</html>
\ No newline at end of file
diff --git a/templates/post.html b/templates/post.html
index 8f61a32e..41b5db75 100644
--- a/templates/post.html
+++ b/templates/post.html
@@ -126,105 +126,9 @@
                 <!-- 文章ai摘要 -->
                 <script th:replace="~{modules/postHeadAiDescription :: postHeadAiDescription}"></script>
 
-
-                <div class="post-tools" id="post-tools">
-                    <div class="post-tools-left">
-
-                        <!-- 打赏 -->
-                        <div th:if="${theme.config.aboutReward.reward.enable_reward_wz}"
-                             class="post-reward" onclick="AddRewardMask()">
-                            <div class="reward-button button&#45;&#45;animated" title="赞赏作者"><i
-                                    class="fas fa-hamburger"></i>
-                                打赏作者
-                            </div>
-                            <div class="reward-main">
-                                <ul class="reward-all"><span class="reward-title">感谢你赐予我前进的力量</span>
-                                    <ul class="reward-group">
-                                        <li class="reward-item"><a th:href="@{${theme.config.aboutReward.reward.wxPay}}"
-                                                                   target="_blank">
-                                            <img alt="微信" class="post-qr-code-img"
-                                                 th:src="${theme.config.aboutReward.reward.wxPay}"></a>
-                                            <div class="post-qr-code-desc">微信</div>
-                                        </li>
-                                        <li class="reward-item"><a th:href="@{${theme.config.aboutReward.reward.alipay}}"
-                                                                   target="_blank"><img alt="支付宝" class="post-qr-code-img"
-                                                                                        th:src="${theme.config.aboutReward.reward.alipay}"></a>
-                                            <div class="post-qr-code-desc">支付宝</div>
-                                        </li>
-                                    </ul>
-                                    <a class="reward-main-btn" th:href="@{${theme.config.aboutReward.reward.reward_md_url}}"
-                                       target="_blank">
-                                        <div class="reward-text">赞赏者名单</div>
-                                        <div class="reward-dec">因为你们的支持让我意识到写文章的价值🙏</div>
-                                    </a>
-                                </ul>
-                            </div>
-                        </div>
-
-                        <!-- 说明 -->
-                        <div th:if="${theme.config.post.post_edit.enable_post_edit}" class="reward-link mode"><a
-                                class="reward-link-button" th:href="@{${theme.config.post.post_edit.post_edit_url}}">
-                            <i class="fas fa-seedling"></i>运营模式与责任</a>
-                        </div>
-
-                        <!-- 分享 -->
-                        <div class="share-link mobile">
-                            <div class="share-qrcode">
-                                <div class="share-button" title="使用手机访问这篇文章"><i class="iconfont icon-qrcode"></i>
-                                </div>
-                                <div class="share-main">
-                                    <div class="share-main-all">
-                                        <div id="qrcode"></div>
-                                        <div class="reward-dec">使用手机访问这篇文章</div>
-                                    </div>
-                                </div>
-                            </div>
-                        </div>
-                        <div class="share-link weibo">
-                            <a class="share-button" rel="noopener external nofollow noreferrer noopener" target="_blank"
-                               th:href="'https://service.weibo.com/share/share.php?title=' + ${post.spec.title}"
-                               title="分享到微博">
-                                <i class="iconfont icon-weibo" style="font-size:22px"></i></a>
-                        </div>
-                        <div class="share-link copyurl">
-                            <div class="share-button" id="post-share-url" onclick="rm.copyPageUrl()" title="复制链接"><i
-                                    class="iconfont icon-link"></i></div>
-                        </div>
-                    </div>
-                    <div class="post-tools-right">
-                        <div class="tag_share">
-                            <div class="post-meta__tag-list">
-                                <a class="post-meta__tags" th:each="tag : ${post.tags}"
-                                   th:href="@{${tag.status.permalink}}">
-                                    <span class="tags-punctuation">[[${tag.spec.displayName}]]</span>
-
-                                    <span class="tagsPageCount" th:text="${tag.status.visiblePostCount}"></span>
-                                </a>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
                 <!-- 版权声明 -->
-                <div class="post-copyright" th:if="${theme.config.post.copyrights.enable}">
-                    <div class="post-copyright__author">
-                        <!-- 版权页 以及版权描述文字 -->
-                        <a class="post-copyright__original" th:href="@{${theme.config.basics.copyrightAgreement}}"
-                           title="该文章为原创文章，注意版权协议">原创</a>
-                        <a class="post-copyright-title" href="#"><span th:text="${post.spec.title}"></span></a>
-                    </div>
-                    <div class="post-copyright__type">
-                        <span class="post-copyright-info" id="post-copyright-url">
-                            <a href="javascript:window.location.href;">[[${post.spec.title}]]</a>
-                        </span>
-                        <button class="post-copyright-copybtn" onclick="rm.copyPageUrl()">
-                            <i class="iconfont icon-paste"></i>
-                        </button>
-                    </div>
-                    <div class="post-copyright__notice">
-                        <span class="post-copyright-info" th:utext="${theme.config.post.copyrights.content}"></span>
-                    </div>
-                </div>
+                <th:block th:replace="~{modules/post/copyright :: copyright}"></th:block>
+
                 <nav class="pagination-post" id="pagination"
                      th:with="postCursor = ${postFinder.cursor(post.metadata.name)}">
                     <div th:class="${postCursor.hasPrevious()==true && postCursor.hasNext()==false} ? 'prev-post2 pull-left postcarnepre' : 'prev-post pull-left'">