When you use code blocks right now they are wrapped in paragraphs, causing a rather untidy look. The following CSS makes it appear as if they were not wrapped in paragraphs:
.ck-content code {
background-color: #785d8e3d;
padding: 0.4rem 0.1em;
border-radius: 0px;
margin-top: -0.3rem;
font-size: 95%;
line-height: 110%;
white-space: pre;
white-space: pre-wrap;
display: -webkit-box;
}
Example:

Pros:
Cons:
This looks nice and I totally understand the need to do this but ... <code> is an inline element and this kind of converts it to a block element. This would cause problems once we have proper code block functionality ...
I see your point.
Unfortunately, because the only way to apply margins that fix the code blocks look was to make it a block element, when one tries to highlight code in the middle of a sentence and apply code, it breaks the sentence into multiple lines. So, while it does look good in blocks, of course the issue is that you can not write code inline without destroying formatting. The easiest solution would be to make two code buttons on the highlight toolbar. One for inline code examples, one for large blocks. The large blocks would have a class that applied the css above, the inline one would have the code formatting already in the app.
Should be in the next ckeditor release.
https://github.com/ckeditor/ckeditor5/issues/436
Hi,
I'm considering switching from Zim to Trilium and this feature is a must have for me. Since the ckeditor5 issue referenced in the previous comment has been closed and the feature added to CKeditor, are there any news about it?
Thanks!
Hi, issue is closed but they did not release a stable version with it yet. Once it's released you can expect Trilium with code blocks pretty soon.
Thanks for your quick reply!
Code block support is in 0.38.0-beta
Most helpful comment
Code block support is in 0.38.0-beta