定制代码块配色问题
lllllmaster-lulllll opened this issue · 2 comments
lllllmaster-lulllll commented
jinghu-moon commented
方法
- 访问 CodeMirror: Theme Demo ,选择符合自己的主题。
- 下载主题代码文件 https://codemirror.net/5/codemirror.zip
- 解压 codemirror.zip,进入 codemirror\codemirror-5.65.16\theme\ 路径,打开 midnight.css。
- 将代码内关键字
midnight
替换为inner
。 midnight
是暗黑主题,则打开 SeeYue\CSS\code-block\dark-theme.css
文件。- 将修改后的
midnight.css
内容复制到dark-theme.css
,重启 Typora,即可。
如果无法下载 codemirror.zip,就复制以下内容,覆盖 dark-theme.css
,效果一样。
/* Based on the theme at http://bonsaiden.github.com/JavaScript-Garden */
/*<!--activeline-->*/
.cm-s-inner .CodeMirror-activeline-background {
background: #253540;
}
.cm-s-inner.CodeMirror {
background: #0F192A;
color : #D1EDFF;
}
.cm-s-inner div.CodeMirror-selected {
background: #314D67;
}
.cm-s-inner .CodeMirror-line::selection,
.cm-s-inner .CodeMirror-line>span::selection,
.cm-s-inner .CodeMirror-line>span>span::selection {
background: rgba(49, 77, 103, .99);
}
.cm-s-inner .CodeMirror-line::-moz-selection,
.cm-s-inner .CodeMirror-line>span::-moz-selection,
.cm-s-inner .CodeMirror-line>span>span::-moz-selection {
background: rgba(49, 77, 103, .99);
}
.cm-s-inner .CodeMirror-gutters {
background : #0F192A;
border-right: 1px solid;
}
.cm-s-inner .CodeMirror-guttermarker {
color: white;
}
.cm-s-inner .CodeMirror-guttermarker-subtle {
color: #d0d0d0;
}
.cm-s-inner .CodeMirror-linenumber {
color: #D0D0D0;
}
.cm-s-inner .CodeMirror-cursor {
border-left: 1px solid #F8F8F0;
}
.cm-s-inner span.cm-comment {
color: #428BDD;
}
.cm-s-inner span.cm-atom {
color: #AE81FF;
}
.cm-s-inner span.cm-number {
color: #D1EDFF;
}
.cm-s-inner span.cm-property,
.cm-s-inner span.cm-attribute {
color: #A6E22E;
}
.cm-s-inner span.cm-keyword {
color: #E83737;
}
.cm-s-inner span.cm-string {
color: #1DC116;
}
.cm-s-inner span.cm-variable {
color: #FFAA3E;
}
.cm-s-inner span.cm-variable-2 {
color: #FFAA3E;
}
.cm-s-inner span.cm-def {
color: #4DD;
}
.cm-s-inner span.cm-bracket {
color: #D1EDFF;
}
.cm-s-inner span.cm-tag {
color: #449;
}
.cm-s-inner span.cm-link {
color: #AE81FF;
}
.cm-s-inner span.cm-error {
background: #F92672;
color : #F8F8F0;
}
.cm-s-inner .CodeMirror-matchingbracket {
text-decoration: underline;
color : white !important;
}
lllllmaster-lulllll commented