feat: 代码块美化第一个版本完成

README_zh_CN.md

@@ -6,6 +6,32 @@
 
 模仿Mac风格的代码块风格，并且对Rem Craft、Savor、Dark+、HBuilderX等热门主题进行专门适配
 
+## 效果展示
+
+### Zhihu
+
+备注：这个代码块样式就是从我的 [Zhihu主题](https://github.com/terwer/siyuan-theme-zhihu) 抠出来的。[手动狗头]
+
+您可以卸载此插件，直接使用 Zhihu主题，当然，您也可以使用此插件，用以下经过适配的主题。PS：默认主题也支持。
+
+![](./assets/zhihu.png)
+
+### Rem Craft
+
+![](./assets/rem-craft.png)
+
+## Savor
+
+![](./assets/savor.png)
+
+### Dark+
+
+![](./assets/dark-plus.png)
+
+### HBuilderX-Light
+
+![](./assets/hbx.png)
+
 ## FAQ
 
 * Q1：怎么使用？需要操作按钮吗？

src/code-block/code-block-dark-plus-plus.styl

@@ -0,0 +1,43 @@
+// -------------------------------------------------代码块-Dark+适配---------------------------------------------------
+html[data-theme-mode="light"][data-light-theme="Dark+"]
+  .code-block
+    overflow auto
+
+  .protyle-wysiwyg [data-node-id].code-block > .protyle-action
+    position absolute
+    background-color: var(--custom-popover-function-menu-background-color);
+    backdrop-filter: var(--custom-backdrop-popover-filter);
+    height 32px
+
+  .b3-typography .code-block .protyle-action .protyle-action__language
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__language
+    right 2.5rem
+    top 0.2rem
+
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__copy
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__menu
+    margin-top 0.3rem
+
+  .protyle-wysiwyg [data-node-id].code-block > .protyle-linenumber__rows
+    padding-top 0 !important
+
+html[data-theme-mode="dark"][data-dark-theme="Dark+"]
+  .code-block
+    border-radius 0 !important
+
+  .protyle-wysiwyg [data-node-id].code-block > .protyle-action
+    position absolute
+    background var(--zhi-code-tab-bg)
+    height 32px
+
+  .b3-typography .code-block .protyle-action .protyle-action__language
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__language
+    right 2.5rem
+    top 0.2rem
+
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__copy
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__menu
+    margin-top 0.3rem
+
+  .protyle-wysiwyg [data-node-id].code-block > .protyle-linenumber__rows
+    padding-top 0 !important

src/code-block/code-block-hbuildx-light.styl

@@ -0,0 +1,23 @@
+// -------------------------------------------------代码块-HBuilderX-Light适配---------------------------------------------------
+html[data-light-theme="HBuilderX-Light"]
+  .code-block
+    overflow auto
+
+  overflow: auto;
+  .protyle-wysiwyg [data-node-id].code-block > .protyle-action
+    height 28px
+
+  .b3-typography .code-block .protyle-action .protyle-action__language
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__language
+    top 0.5rem
+    right 3rem
+
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__copy
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__menu
+    margin-top 0.2rem
+
+  .protyle-linenumber__rows>span {
+    pointer-events: none;
+    display: block;
+    padding: 0.75px 8px;
+  }

src/code-block/code-block-rem-craft.styl

@@ -0,0 +1,12 @@
+// -------------------------------------------------代码块-Rem Craft适配---------------------------------------------------
+html[data-light-theme="Rem Craft"]
+  .b3-typography .code-block, .protyle-wysiwyg .code-block
+    background var(--zhi-code-tab-bg)
+
+  .b3-typography .code-block .protyle-action .protyle-action__language
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__language
+    right 5rem
+    top -0.1rem
+
+  .protyle-linenumber__rows
+    margin-top 8px !important

src/code-block/code-block-savor.styl

@@ -0,0 +1,5 @@
+// -------------------------------------------------代码块-Savor适配---------------------------------------------------
+html[data-light-theme="Savor"]
+  .b3-typography .code-block .protyle-action .protyle-action__language
+  .protyle-wysiwyg .code-block .protyle-action .protyle-action__language
+    top 0.2rem

src/index.styl

@@ -1,15 +1,25 @@
-// 基本变量
-@import "/Users/terwer/Documents/mydocs/SiYuanWorkspace/public/conf/appearance/themes/Zhihu/style/common/vars/vars-zhi"
-
-//// web字体
-//@import "../../../styles/common/fonts/webfont/opensans"
-//
-//// 基本样式
-//@import "../../../styles/common/basic"
-//
-//// 重写代码块样式
-//:root
-//  --zhi-font-family-code "Open Sans", "JetBrains Mono", "-apple-system", "Microsoft YaHei", "Times New Roman", , "LXGW WenKai", "方正北魏楷书_GBK"
-//
+// 通用变量定义
+@import "/Users/terwer/Documents/mydocs/SiYuanWorkspace/public/conf/appearance/themes/Zhihu/style/common/vars/vars-common"
+
+// web字体
+// fonts = lxgw + opensans
+@import "/Users/terwer/Documents/mydocs/SiYuanWorkspace/public/conf/appearance/themes/Zhihu/style/common/fonts/webfont/webfont.css"
+
+// ---------------------------------------------------------------------------------------------------------------------
+// 整体背景、字体颜色
+// _font-family-mono = "Open Sans", "LXGW WenKai", "JetBrains Mono", "-apple-system", "Microsoft YaHei", "Times New Roman", "方正北魏楷书_GBK"
+// @import "/Users/terwer/Documents/mydocs/SiYuanWorkspace/public/conf/appearance/themes/Zhihu/style/theme/basic"
+
+// 重写样式
+body
+  // 字体
+  --b3-font-family-code _font-family-mono
+
 // 代码块
-@import "/Users/terwer/Documents/mydocs/SiYuanWorkspace/public/conf/appearance/themes/Zhihu/style/theme/code-block"
+@import "/Users/terwer/Documents/mydocs/SiYuanWorkspace/public/conf/appearance/themes/Zhihu/style/theme/code-block"
+
+// 代码块适配
+@import "./code-block/code-block-savor"
+@import "./code-block/code-block-rem-craft"
+@import "./code-block/code-block-dark-plus-plus"
+@import "./code-block/code-block-hbuildx-light"