Code block formatting in edit view

[justinkelly]

When using the ``` code blocks

What I expect

• when editing a code block - using ``` or 4 spaces
• i expect that code block in the edit view looks like the code block in the render view
• I expect that the area is all grey (full width) and no white gaps between the code lines

What happens

• when editing the code block only the background of the typed letters is grey and has white lines between the code lines
• refer image below for example

Thanks for all your great work on this amazing project!!

[bennett-jacob]

Just to clarify, you mean applying the page css for the code tag to the code block in the editor, right? Which in most browsers and css styles means the font is monospaced, and in some cases (like yours) the entire block has a colored background.

[soraphis]

well, i would find it cool to have the code-text in the editor view in monospace, like with this rule:

.cm-comment {
    font-family: Monospace;
}

to get the full block background:

.cm-comment:first-child:last-child {
    width: 95%; /* don't 100%, you need space for the four whitespaces if indentation is used */
    display: inline-block;
    line-height: 1.7;
}

.cm-comment {
    font-family: monospace;
}

for further more improvements one would need to dig into the javascript... its 2am i'm to tired for this now