Backup: 1.4.3
Copy Code Blocks: 2.0.0
Freehand Drawing: 3.0.1
Insert Date: 1.0.1
Note list and sidebar toggle buttons: 1.0.3
Sync target
Nextcloud
Editor
Markdown Editor
What issue do you have?
I am able to change the background color of text lines in code blocks by adding the style definition to userstyle.css:
code,.inline-code {
background: #d6d3d1;
}
But how do I make the color of the code block itself darker? In the attached screenshot, I would like the darker grey behind the entire text stanza, not just behind the text itself.
I’m seeing that this is similar to LeoW’s link that you said didn’t work for you, though. To get this I opened Joplin’s Help menu, then selected “Toggle development tools”. That opens a new pane. In the very top left of that new pane is this icon:
(you can also just press Ctrl+Shift+C once the dev tools are open)
When clicked, you can move your mouse over your code block until the entire thing is highlighted - and once it is, the little popup will tell you what element and class it is, for targeting in your CSS:
On a side note, the element inspector is brilliant. Until now, Joplin has just been a note-taking tool for me; it never occurred to me that it’s actually just an apparently Chromium-based browser. This dialogue changed how I will interact with the software; thank you for that, too!
Please keep in mind this is a randomly generated class name, which means that it may change anytime with future Joplin update. If possible, it’s better to target elements with proper classes or using HTML tags.
Edit:
This particular class is OK. See below for explanation.
(you can also just press Ctrl+Shift+C once the dev tools are open)