💄 ui(主题优化):

1. 调整配色
2. 更改标题样式：改了下背景色、添加了一点阴影、添加了savor的标题提示

style/editor.css

@@ -73,7 +73,8 @@
     font-size: 1.35em !important;
     /* color: var(--custom-h3-color) !important; */
     color: var(--b3-card-info-color);
-    background-color: var(--b3-card-info-background);
+    background-color: #d1ecf7;
+    box-shadow: 2px 2px 2px var( --b3-table-border-color);
 }
 
 /* 三级标题前面添加竖线*/
@@ -122,14 +123,17 @@
     font-size: 1.2em !important;
     /* color: var(--custom-h4-color); */
     color: var(--b3-card-success-color);
-    background-color: var(--b3-card-success-background);
+    background-color: #D8F9E6;
+    box-shadow: 2px 2px 2px var( --b3-table-border-color);
+
 }
 /* 5. 五级标题样式setup */
 .protyle-wysiwyg [data-node-id].h5,
 .b3-typography h5 {
     font-size: 1.1em !important;
     /* color: var(--custom-h5-color); */
     background-color: #bec6e891;
+    box-shadow: 2px 2px 2px var(--b3-table-border-color);
 }
 
 /* 6. 六级标题样式setup */

style/module/h-reminder.css

@@ -0,0 +1,106 @@
+/*.protyle-wysiwyg .h1>[spellcheck]:has([data-type="inline-math"]),
+.protyle-wysiwyg .h2>[spellcheck]:has([data-type="inline-math"]),
+.protyle-wysiwyg .h3>[spellcheck]:has([data-type="inline-math"]),
+.protyle-wysiwyg .h4>[spellcheck]:has([data-type="inline-math"]),
+.protyle-wysiwyg .h5>[spellcheck]:has([data-type="inline-math"]),
+.protyle-wysiwyg .h6>[spellcheck]:has([data-type="inline-math"]){
+	white-space:normal;
+}*/
+:root {
+    --h1-list-graphic: #eb8383;
+	--h2-list-graphic: #ae9acb;
+	--h3-list-graphic: #63a4c1;
+	--h4-list-graphic: #71a796;
+	--h5-list-graphic: #3b51a4;
+	--h6-list-graphic: #dda36a;
+}
+
+
+/* .protyle-wysiwyg .h1>[spellcheck]:not(:empty)::after{
+	content:"";
+	position:absolute;
+	float:left;
+	margin-left:5px;
+	height:0.45em;
+	width:0.15em;
+	bottom:0.5em;
+	border-radius:3px;
+	background-color:var(--h1-list-graphic);
+	opacity:0.5;
+}
+.protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h1>[spellcheck]::after{
+	bottom:0.2em;
+} */
+
+/* .protyle-wysiwyg .h2>[spellcheck]:not(:empty)::after{
+	content:"";
+	position:absolute;
+	float:left;
+	margin-left:5px;
+	height:0.16em;
+	width:0.16em;
+	bottom:0.76em;
+	border-radius:3px;
+	background-color:var(--h2-list-graphic);
+	opacity:0.5;
+	box-shadow: 0.25em 0.25em 0 0 var(--h2-list-graphic);
+}
+.protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h2>[spellcheck]::after{
+	bottom:0.5em;
+} */
+
+.protyle-wysiwyg .h3>[spellcheck]:not(:empty)::after{
+	content:"";
+	position:absolute;
+	float:left;
+	margin-left:5px;
+	height:0.16em;
+	width:0.16em;
+	bottom:0.62em;
+	border-radius:3px;
+	background-color:var(--h3-list-graphic);
+	opacity:0.5;
+	box-shadow: 0.25em 0.25em 0 0 var(--h3-list-graphic),0 0.25em 0 0 var(--h3-list-graphic);
+}
+
+.protyle-wysiwyg .h4>[spellcheck]:not(:empty)::after{
+	content:"";
+	position:absolute;
+	float:left;
+	margin-left:5px;
+	height:0.15em;
+	width:0.15em;
+	bottom:0.68em;
+	border-radius:3px;
+	background-color:var(--h4-list-graphic);
+	opacity:0.5;
+	box-shadow: 0.25em 0.25em 0 0 var(--h4-list-graphic),0 0.25em 0 0 var(--h4-list-graphic),0.25em 0 0 0 var(--h4-list-graphic);
+}
+
+.protyle-wysiwyg .h5>[spellcheck]:not(:empty)::after{
+	content:"";
+	position:absolute;
+	float:left;
+	margin-left:5px;
+	height:0.15em;
+	width:0.15em;
+	bottom:0.8em;
+	border-radius:3px;
+	background-color:var(--h5-list-graphic);
+	opacity:0.5;
+	box-shadow: 0.25em 0.25em 0 0 var(--h5-list-graphic),0 0.25em 0 0 var(--h5-list-graphic),0.25em 0 0 0 var(--h5-list-graphic),0 -0.25em 0 0 var(--h5-list-graphic);
+}
+
+.protyle-wysiwyg .h6>[spellcheck]:not(:empty)::after{
+	content:"";
+	position:absolute;
+	float:left;
+	margin-left:5px;
+	height:0.15em;
+	width:0.15em;
+	bottom:0.9em;
+	border-radius:3px;
+	background-color:var(--h6-list-graphic);
+	opacity:0.5;
+	box-shadow: 0.25em 0.25em 0 0 var(--h6-list-graphic),0 0.25em 0 0 var(--h6-list-graphic),0.25em 0 0 0 var(--h6-list-graphic),0 -0.25em 0 0 var(--h6-list-graphic),0.25em -0.25em 0 0 var(--h6-list-graphic);
+}

style/theme/Tsundoku_dark.css

@@ -75,11 +75,11 @@
     --b3-font-color5: #b4b4b4;
     --b3-font-color6: #6cf9ee;
     --b3-font-color7: var(--b3-theme-secondary);
-    --b3-font-color8: #eb5042;
+    --b3-font-color8: #f5822e;
     --b3-font-color9: #0d0d0f;
     --b3-font-color10: #ca98ff;
     --b3-font-color11: #d90ec5;
-    --b3-font-color12: #f5822e;
+    --b3-font-color12: #eb5042;
     --b3-font-color13: var(--b3-theme-background);
     --b3-font-background1: #ff8f8999;
     --b3-font-background2: #e5aa57c0;
@@ -88,11 +88,11 @@
     --b3-font-background5: #6f8ca38f;
     --b3-font-background6: #09a1b873;
     --b3-font-background7: #f3a82fbd;
-    --b3-font-background8: #a7443cd3;
-    --b3-font-background9: #5667bb9d;
+    --b3-font-background8: #a35b28ce;
+    --b3-font-background9: #324272;
     --b3-font-background10: #a979d683;
     --b3-font-background11: #98268b;
-    --b3-font-background12: #a35b28ce;
+    --b3-font-background12: #a7443cd3;
     --b3-font-background13: var(--b3-theme-on-background);
     /* PDF */
     --b3-pdf-sidebar-width: 200px;
@@ -865,3 +865,38 @@ div[data-subtype='t'][data-type='NodeList'] {
     max-width: 100%;
     background-color: #fff;
 }
+
+
+
+.protyle-wysiwyg [data-node-id].bq, .b3-typography blockquote{
+    color: #a79d9d;
+}
+
+
+.protyle-wysiwyg [data-node-id].h3,
+.b3-typography h3 {
+    /* ⚙三级标题基本样式 */
+    font-size: 1.35em !important;
+    /* color: var(--custom-h3-color) !important; */
+    color: var(--b3-card-info-color);
+    background-color: #30677d;
+    box-shadow: 2px 2px 5px #36393c;
+}
+/* 4. 四级标题样式setup */
+.protyle-wysiwyg [data-node-id].h4,
+.b3-typography h4 {
+    font-size: 1.2em !important;
+    /* color: var(--custom-h4-color); */
+    color: var(--b3-card-success-color);
+    background-color: #406e53;
+    box-shadow: 2px 2px 5px #36393c;
+
+}
+/* 5. 五级标题样式setup */
+.protyle-wysiwyg [data-node-id].h5,
+.b3-typography h5 {
+    font-size: 1.1em !important;
+    /* color: var(--custom-h5-color); */
+    background-color: #bec6e891;
+    box-shadow: 2px 2px 5px #36393c;
+}

style/theme/Tsundoku_green.css

@@ -82,24 +82,24 @@
     --b3-font-color5: #8e8e8e;
     --b3-font-color6: #52d4ca;
     --b3-font-color7: var(--b3-theme-secondary);
-    --b3-font-color8: #d32a1b;
+    --b3-font-color8: #a3431f;
     --b3-font-color9: #596ab7;
     --b3-font-color10: #944194;
     --b3-font-color11: #d447c5;
-    --b3-font-color12: #a3431f;
+    --b3-font-color12: #6a0b03;
     --b3-font-color13: var(--b3-theme-background);
     --b3-font-background1: var(--b3-card-error-background);
     --b3-font-background2: var(--b3-card-warning-background);
     --b3-font-background3: var(--b3-card-info-background);
     --b3-font-background4: var(--b3-card-success-background);
-    --b3-font-background5: #dfddddaf;
-    --b3-font-background6: #27e6ff42;
-    --b3-font-background7: #fff19598;
-    --b3-font-background8: #fe6567;
-    --b3-font-background9: #ccd3f3;
-    --b3-font-background10: #d2cbff;
-    --b3-font-background11: #f4d0f0;
-    --b3-font-background12: #edd9d2;
+    --b3-font-background5: #e2e3e4;
+    --b3-font-background6: #D8FAFF;
+    --b3-font-background7: #fff7d1;
+    --b3-font-background8: #e7e3c5;
+    --b3-font-background9: #E9E9FF;
+    --b3-font-background10: #E5DAFF;
+    --b3-font-background11: #f5c7f0;
+    --b3-font-background12: #ff9697;
     --b3-font-background13: var(--b3-theme-on-background);
     /* PDF */
     --b3-pdf-sidebar-width: 200px;
@@ -920,3 +920,36 @@ div[data-subtype='t'][data-type='NodeList'] {
 .av__row--footer {
     background-color: inherit !important;
 }
+
+
+
+/* 3. 三级标题样式setup */
+
+.protyle-wysiwyg [data-node-id].h3,
+.b3-typography h3 {
+    /* ⚙三级标题基本样式 */
+    font-size: 1.35em !important;
+    /* color: var(--custom-h3-color) !important; */
+    color: var(--b3-card-info-color);
+    background-color: #afd8e8;
+    box-shadow: none;
+}
+
+/* 4. 四级标题样式setup */
+.protyle-wysiwyg [data-node-id].h4,
+.b3-typography h4 {
+    font-size: 1.2em !important;
+    /* color: var(--custom-h4-color); */
+    color: var(--b3-card-success-color);
+    background-color: #b2e2c6;
+    box-shadow: none;
+
+}
+/* 5. 五级标题样式setup */
+.protyle-wysiwyg [data-node-id].h5,
+.b3-typography h5 {
+    font-size: 1.1em !important;
+    /* color: var(--custom-h5-color); */
+    background-color: #bec6e891;
+    box-shadow: none;
+}

theme.css

@@ -1,20 +1,22 @@
 /* theme.css 只放导出的样式，以及各个主题统一的样式，具体每个主题特殊的样式会放到各自主题的css中 */
 /* 导入编辑器基础块和行内样式 */
 @import url('style/editor.css');
+/* 导入标题样式 */
+@import url('style/module/h-reminder.css');
 /* 导入代码块样式 */
-@import url('style/func/code_block.css');
+@import url('style/module/code_block.css');
 /* 导入自定义有序列表样式 */
-@import url('style/func/ol.css');
+@import url('style/module/ol.css');
 /* 导入折叠样式css */
-@import url('style/func/fold.css');
+@import url('style/module/fold.css');
 /* 导入超链接图标样式 */
-@import url('style/func/link_icon.css');
+@import url('style/module/link_icon.css');
 /* 导入数据库样式 */
 @import url('style/database.css');
 /* 导入文档属性 */
 @import url('style/doc_attr.css');
 /* 导入Admonition样式 */
-@import url('style/func/Admonition.css');
+@import url('style/module/Admonition.css');
 /* 导入块自定义属性 */
 @import url('style/attr.css');
 /* 导入列表转换样式 */
@@ -24,7 +26,7 @@
 @import url('style/block_attr/table.css');
 
 /* 导入主题切换按钮选项 */
-@import url('style/func/notionToolBar.css');
+@import url('style/module/notionToolBar.css');
 
 :root {
     /* 主色 */
@@ -104,24 +106,24 @@
     --b3-font-color5: #8e8e8e;
     --b3-font-color6: #52d4ca;
     --b3-font-color7: var(--b3-theme-secondary);
-    --b3-font-color8: #6a0b03;
+    --b3-font-color8: #a3431f;
     --b3-font-color9: #596ab7;
     --b3-font-color10: #944194;
     --b3-font-color11: #d447c5;
-    --b3-font-color12: #a3431f;
+    --b3-font-color12: #6a0b03;
     --b3-font-color13: var(--b3-theme-background);
     --b3-font-background1: var(--b3-card-error-background);
     --b3-font-background2: var(--b3-card-warning-background);
     --b3-font-background3: var(--b3-card-info-background);
     --b3-font-background4: var(--b3-card-success-background);
-    --b3-font-background5: #f2f2f2;
-    --b3-font-background6: #19e4ff2b;
-    --b3-font-background7: #fff19598;
-    --b3-font-background8: #ff9697;
-    --b3-font-background9: #bec6e891;
-    --b3-font-background10: #d2cbff;
-    --b3-font-background11: #d2cbffa8;
-    --b3-font-background12: #edd9d2;
+    --b3-font-background5: #e2e3e4;
+    --b3-font-background6: #D8FAFF;
+    --b3-font-background7: #FEF7D2;
+    --b3-font-background8: #F0EDE0;
+    --b3-font-background9: #E9E9FF;
+    --b3-font-background10: #E5DAFF;
+    --b3-font-background11: #f5c7f0;
+    --b3-font-background12: #ff9697;
     --b3-font-background13: var(--b3-theme-on-background);
     /* PDF */
     --b3-pdf-sidebar-width: 200px;