Note editor appearance

Support
1

Hello everyone!

I am using Joplin 2.7.13 (the latest version) on a laptop running Windows 10 Home, and I have a problem with the note editor (markdown).

I haven't used Joplin in a while, but I remember the note editor being in coloured monospace font. Now it looks the same as the font in the viewer panel.

I am really sorry for asking such a noob question, but I've been trying to solve the problem myself for the past few hours (playing with the appearance settings) and I've searched online for the answer, but I didn't find the answer I was looking for.

Thank you in advance!

2

Have a look at this post - should have everything you need.
The styling was changed quite a few versions back now.

1 Like
3

Thank you very much!

4

I've changed the files according to this post, quit the app, started it again, but nothing has changed.

5

If you are on Windows make sure you have fully quit the app and not just minimised it to the systray.
If you have definitely done that then can you post the contents of your userchrome.css file here (put it in a code fence by surrounding in triple backticks (```))

6

Thank you for the replies!
I've made sure to properly quit the app. Here are the conents of my userchrome.css:

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;}```
7

That one works fine for me. Are you using the right theme for it? (i.e. to use that one you need to be using the dark theme, for the light theme you need to use a different set).

8

Yes, I am using the dark theme. I think I give up.

9

The userchrome.css css above should change colours and some styling, however setting the editor to use a monospace font again is done using Appearance in the settings menu. Just enter the name of a monospace font installed on your system.

font-options

10

Thank you for the reply! I've already done that and consider it a good enough compromise.

11

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