Zuoqiu-Yingyi / siyuan-theme-dark-plus

思源笔记的一款多功能双模式主题 | A multifunctional dual-mode theme of SiYuan Note.
GNU Affero General Public License v3.0
139 stars 14 forks source link

行内代码样式修改建议:sparkles: #173

Closed huamang closed 1 year ago

huamang commented 1 year ago

在什么情况下你需要该特性?In what scenarios do you need this feature?

我使用light下的Dark+主题,发现行内代码其实不太明显

image

所以我尝试模仿了几个博客中行内代码的配色,觉得这样展示行内代码会比较清晰

image

描述可能的最优解决方案 Describe the optimal solution

以下是我对于这次样式修改的css代码

:root {
/* 行内代码背景颜色 */
  --b3-protyle-code-background: rgba(27,31,35,0.05);
}
/* 行内字体代码 */
.protyle-wysiwyg code:not(.hljs),
.b3-typography code:not(.hljs),
.protyle-wysiwyg span[data-type~=code]:not(.hljs),
.b3-typography span[data-type~=code]:not(.hljs) {
color: #f47466;
}

描述候选的解决方案 Describe the candidate solution

No response

其他信息 Other information

No response

Zuoqiu-Yingyi commented 1 year ago

那我添加一个 CSS 变量 --custom-span-code-color 设置行内代码的背文字颜色吧, 方便用户自定义