页脚图标添加自定义

settings.yaml

@@ -509,8 +509,6 @@ spec:
                   value: col2
                 - label: 三列
                   value: col3
-                - label: 四列
-                  value: col4
             - $formkit: select
               name: postLocation
               label: 封面位置
@@ -933,29 +931,56 @@ spec:
               label: 左侧
               value: [ ]
               children:
-                - $formkit: text
+                - $formkit: radio
+                  name: option_social_data
+                  label: 类型
+                  value: icon
+                  help: "icon图标选择icon图标，svg代码或者图片(如果使用图片请输入完整img标签)选择自定义"
+                  options:
+                    - value: icon
+                      label: icon图标
+                    - value: custom
+                      label: 自定义
+                - $formkit: textarea
                   name: icon
+                  help: "icon图标，svg代码，图片(如果使用图片请输入完整img标签)"
                   label: 图标
+                  validation: "required"
                 - $formkit: text
                   name: name
                   label: 名称
+                  validation: "required"
                 - $formkit: text
                   name: url
                   label: 链接
+                  validation: "required"
             - $formkit: repeater
               name: socialMediaRight
               label: 右侧
               value: [ ]
               children:
-                - $formkit: text
+                - $formkit: radio
+                  name: option_social_data
+                  label: 类型
+                  value: icon
+                  options:
+                    - value: icon
+                      label: icon图标
+                    - value: custom
+                      label: 自定义
+                - $formkit: textarea
                   name: icon
+                  help: "icon图标或svg代码或者图片(如果使用图片请输入完整img标签)"
                   label: 图标
+                  validation: "required"
                 - $formkit: text
                   name: name
                   label: 名称
+                  validation: "required"
                 - $formkit: text
                   name: url
                   label: 链接
+                  validation: "required"
         - $formkit: menuRadio
           name: menu
           label: 相关链接

templates/assets/css/fullPage.css

@@ -11,14 +11,18 @@
 
 }
 
-.back-home-button {
+.page .back-home-button {
     color: rgba(255, 255, 255, 0.7);
 }
 
-#nav #site-name {
+.page #nav #site-name span {
     color: var(--light-grey);
 }
 
+.nav-fixed #nav #site-name span{
+    color: var(--heo-fontcolor);
+}
+
 #nav .site-page {
     color: rgba(255, 255, 255, 0.7);
 }

templates/assets/zhheo/zhheoblog.css

@@ -5362,10 +5362,11 @@ html {
     }
 }
 
-.nav-fixed #nav .back-home-button {
+.nav-fixed #nav .back-home-button{
     color: var(--heo-fontcolor);
 }
 
+
 .back-home-button:hover {
     background: var(--heo-main);
     color: var(--heo-white);
@@ -6276,6 +6277,22 @@ a.deal_link:hover {
     transform: scale(1.1)
 }
 
+a.custom_socials {
+    display: flex;
+    margin: 1rem 27px;
+    border-radius: 3rem;
+    width: 32px;
+    height: 32px;
+    justify-content: center;
+    align-items: center;
+    transition: 0.3s;
+}
+
+a.custom_socials:hover {
+    transform: scale(1.1)
+}
+
+
 img.footer_mini_logo {
     width: 50px;
     height: 50px;

templates/fcircle.html

@@ -72,10 +72,12 @@
                 <script type="text/javascript" th:src="${assets_link + '/libs/moments/bundle.js'}"></script>
 
                 <style>
-                    /*修复友链朋友圈管理面板显示太大导致无法关闭的bug*/
+                    .cf-article-author:hover {
-                    .cf-manage-pannel[data-v-34921c7c] {
+                        color: var(--heo-card-bg)!important
-                        width: 80% !important;
+                    }
-                        height: 80% !important;
+                    #cf-more:hover{
+                        background: var(--heo-lighttext)!important;
+                        color: var(--heo-card-bg)!important
                     }
                 </style>
 

templates/modules/footer.html

@@ -12,9 +12,10 @@
     <!-- 社交链接，需要填入 href class title -->
     <div id="footer_deal">
         <th:block th:with="socialMedias = ${theme.config.footer.social_media.socialMediaLeft}">
-            <a class="deal_link" rel="external nofollow" target="_blank" th:each="socialMedia : ${socialMedias}"
+            <a th:class="${socialMedia.option_social_data == 'custom' ? 'custom_socials' : 'deal_link'}" rel="external nofollow" target="_blank" th:each="socialMedia : ${socialMedias}"
                th:href="${socialMedia.url}" th:title="${socialMedia.name}">
-                <i th:class="${socialMedia.icon}"></i>
+                <i th:if="${socialMedia.option_social_data == 'icon'}" th:class="${socialMedia.icon}"></i>
+                <th:block th:if="${socialMedia.option_social_data == 'custom'}" th:utext="${socialMedia.icon}"></th:block>
             </a>
         </th:block>
 
@@ -22,9 +23,11 @@
              th:with="img = @{${theme.config.footer.social_media.centerImg}}" th:src="${isLazyload ? '' : img}"
              th:data-lazy-src="${ isLazyload ? img : ''}" title="返回顶部" onclick="btf.scrollToDest(0, 500)">
         <th:block th:with="socialMedias = ${theme.config.footer.social_media.socialMediaRight}">
-            <a class="deal_link" rel="external nofollow" target="_blank" th:each="socialMedia : ${socialMedias}"
+            <a th:class="${socialMedia.option_social_data == 'custom' ? 'custom_socials' : 'deal_link'}" rel="external nofollow" target="_blank" th:each="socialMedia : ${socialMedias}"
                th:href="${socialMedia.url}" th:title="${socialMedia.name}">
-                <i th:class="${socialMedia.icon}"></i>
+                <i th:if="${socialMedia.option_social_data == 'icon' || #strings.isEmpty(socialMedia.option_social_data)}"
+                   th:class="${socialMedia.icon}"></i>
+                <th:block th:if="${socialMedia.option_social_data == 'custom'}" th:utext="${socialMedia.icon}"></th:block>
             </a>
         </th:block>
     </div>