Dark theme syntax highlighting

Support
1

After upgrading to version 2.4.9 the color highlighting for bulleted lists is no longer available.

Is there a way to restore those without a working knowledge of CSS?

I am not change averse but I use my notes when I am speaking and the color changes allow me to present smoothly without losing my place. Without the colors, it is just a big blob of text.

I tried grabbing the CSS from the wiki post but that is for the light theme and uses colors that are not readable on a dark theme.

2

Have a look at this post in this topic: Markdown editor, style/CSS lost with upgrade - #8 by penfold

1 Like
3

I tried that before posting but the results are what I described above. You get a dark theme with many of the colors from the light theme which isn't readable. Shades of blue, purple and green. The green is jarring but readable. However, all the blues and purple-ish colors do not have enough contrast to be readable on a dark theme.

4

Try the following. There might be some incorrect stuff but this is what I got for a 5 min comparison from the old dark theme.

div.CodeMirror.cm-s-material-darker span.cm-header {color: #dddddd;}
div.CodeMirror.cm-s-material-darker span.cm-quote {color: #dddddd;}
div.CodeMirror.cm-s-material-darker span.cm-negative {color: #d44;}
div.CodeMirror.cm-s-material-darker span.cm-positive {color: #292;}
div.CodeMirror.cm-s-material-darker span.cm-header, span.cm-strong {font-weight: bold;}
div.CodeMirror.cm-s-material-darker span.cm-em {font-style: italic;}
div.CodeMirror.cm-s-material-darker span.cm-link {text-decoration: underline;}
div.CodeMirror.cm-s-material-darker span.cm-strikethrough {text-decoration: line-through;}

div.CodeMirror.cm-s-material-darker span.cm-keyword {color: #c792ea;}
div.CodeMirror.cm-s-material-darker span.cm-atom {color: #f78c6c;}
div.CodeMirror.cm-s-material-darker span.cm-number {color: #ff5370;}
div.CodeMirror.cm-s-material-darker span.cm-def {color: #00f;}
div.CodeMirror.cm-s-material-darker span.cm-variable,
div.CodeMirror.cm-s-material-darker span.cm-punctuation,
div.CodeMirror.cm-s-material-darker span.cm-property,
div.CodeMirror.cm-s-material-darker span.cm-operator {}
div.CodeMirror.cm-s-material-darker span.cm-variable-2 {color: #eeffff;}
div.CodeMirror.cm-s-material-darker span.cm-variable-3, div.CodeMirror.cm-s-material-darker span.cm-type {color: #decb6b;}
div.CodeMirror.cm-s-material-darker span.cm-comment {color: #878787;}
div.CodeMirror.cm-s-material-darker span.cm-string {color: #c3e88d;}
div.CodeMirror.cm-s-material-darker span.cm-string-2 {color: #f50;}
div.CodeMirror.cm-s-material-darker span.cm-meta {color: #ffcb6b;}
div.CodeMirror.cm-s-material-darker span.cm-property {color: #decb6b;}
div.CodeMirror.cm-s-material-darker span.cm-qualifier {color: #555;}
div.CodeMirror.cm-s-material-darker span.cm-builtin {color: #30a;}
div.CodeMirror.cm-s-material-darker span.cm-bracket {color: #ff5370;}
div.CodeMirror.cm-s-material-darker span.cm-tag {color: #ff5370;}
div.CodeMirror.cm-s-material-darker span.cm-attribute {color: #00c;}
div.CodeMirror.cm-s-material-darker span.cm-hr {color: #dddddd;}
div.CodeMirror.cm-s-material-darker span.cm-link {color: #c3e88d;}
div.CodeMirror.cm-s-material-darker span.cm-link-text {color: #dddddd;}
div.CodeMirror.cm-s-material-darker span.cm-operator {color: #89ddff;}

div.CodeMirror.cm-s-material-darker span.cm-error {color: #dddddd;}
span.cm-invalidchar {color: #f00;}
4 Likes
5

Thank you very much!

That definitely does what I need it to.

1 Like
6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.