主题基色

templates/assets/zhheo/zhheoblog.css

@@ -92,7 +92,7 @@
     --heo-maskbgdeep: rgba(0, 0, 0, 0.85);
     --heo-hovertext: #0A84FF;
     --heo-ahoverbg: #fff;
-    --heo-lighttext: #f2b94b;
+    --heo-lighttext: var(--heo-main);
     --heo-secondtext: #a1a2b8;
     --heo-scrollbar: rgba(200, 200, 223, 0.4);
     --heo-card-btn-bg: #30343f;

templates/modules/layouts/layout.html

@@ -205,15 +205,8 @@
 
 </div>
 
-<style type="text/css" th:inline="css">
+<!-- 根据配置设置 css 变量值，全局 css 通过变量值进行处理 -->
-    [data-theme=light] {
+<th:block th:replace="modules/variables/layout"></th:block>
-        --heo-theme: [(${theme.config.style.themeLightSkin})];
-    }
-
-    [data-theme=dark] {
-        --heo-theme: [(${theme.config.style.themeDarkSkin})];
-    }
-</style>
 
 <script data-pjax="">
 

templates/modules/variables/layout.html

@@ -0,0 +1,16 @@
+<style type="text/css" th:inline="css" th:fragment="variables-root">
+    [data-theme=light] {
+        --heo-theme: [(${theme.config.style.themeLightSkin})] !important;
+        --heo-theme-op: [(${theme.config.style.themeLightSkin})]23 !important;
+        --heo-theme-op-deep: [(${theme.config.style.themeLightSkin})]dd !important;
+        --heo-theme-none: [(${theme.config.style.themeLightSkin})]00 !important;
+    }
+
+    [data-theme=dark] {
+        --heo-theme: [(${theme.config.style.themeDarkSkin})] !important;
+        --heo-theme-op: [(${theme.config.style.themeDarkSkin})]23 !important;
+        --heo-theme-op-deep: [(${theme.config.style.themeDarkSkin})]dd !important;
+        --heo-theme-none: [(${theme.config.style.themeDarkSkin})]00 !important;
+
+    }
+</style>