Home → Problems →

Code block without highlighting

This discussion is public.

1. Support Staff 1 Brett on 03 Jul, 2017 03:44 PM

   Hi Peter

   If you use backticks with the lang specifier of "text", you should be
   able to disable highlighting:

   ```text
   Ascii diagram
   ```

2. 2 peterdshannon on 03 Jul, 2017 07:20 PM

   Hi Brett,

   thanks for you reply. Sorry to write it didn't help; it seems to have the
   same effect as no-highlight.

   Best Regards,

   Peter.

3. Support Staff 3 Brett on 03 Jul, 2017 07:57 PM

   Could you attach a sample markdown file for me to test?

   Thanks,
   Brett

4. 4 peterdshannon on 04 Jul, 2017 03:30 AM

   I've attached a small sample (foobar.md)

   Toggling Syntax Highlighting or adding either text or no-highlight after the fence all seem to have the same effect.

   • foobar.md 7.5 KB

5. Support Staff 5 Brett on 04 Jul, 2017 02:46 PM

   The attached version works as expected for me, with either MMD or GFM processor. I did notice that I had to ensure that "Process Markdown Inside of HTML" (Processor prefs) was disabled or I got some odd results with indented text within the block.

   • foobar.md 7.48 KB

6. 6 peterdshannon on 05 Jul, 2017 04:06 AM

   Hi Brett,

   I think I can help you recreate what I'm seeing. I took the code and pasted it into an html page (~~attached~~ it seems like it I can't view this from the link, not sure what is wrong) with the CSS to set the font and line height:

   pre code {  
       font-family: Menlo, Georgia, Garamond, serif !important;
       font-size: 40%;
   }
   

   I opened it in Chrome and it displayed correctly (no vertical gap between lines, as with syntax highlighting enabled.) I think the problem is the font-size: Marked 2 resizes the font but doesn't change the line-height (actually, I don't know if this is the correct property or other things play into how much space a line uses.)

   I also found that if I export to HTML with font-size set the resulting web page is broken in the same way but if I remove it—and zoom out—the file is presented correctly.

   • foo.html 7.5 KB

7. Support Staff 7 Brett on 06 Jul, 2017 03:21 PM

   I think I've figured out the issue. The pre-block wraps in most of the
   themes, so even lines that just have extra whitespace at the end wrap
   into the next line, adding double linespacing if the preview window is
   too narrow to fit. You can confirm this by switching to the GitHub
   theme, where you should see a correct result.

   The solution to this is to go to Preferences->Style and click "Edit CSS"
   under Additional Styles. Paste in the following:

   ```
   #wrapper pre {
      padding: 16px;
      margin-bottom: 16px;
      overflow: auto;
      font-size: 85%;
      line-height: 1.45;
      border-radius: 3px;
      word-wrap: normal;
   }
   #wrapper pre code {
      font-family: Menlo;
      letter-spacing: -.2px;
      line-height: 1;
      display: inline;
      max-width: initial;
      padding: 0;
      margin: 0;
      overflow: initial;
      line-height: inherit;
      word-wrap: normal;
      border: 0;
   }
   ```

   This should give you consistent results diagrams across all of the
   themes. Let me know if that helps.

   -Brett

8. Support Staff 8 Brett on 06 Jul, 2017 03:54 PM

   FYI, I've added a new option under Style preferences for the next
   version to allow doing this with a click.

   -Brett

9. 9 peterdshannon on 07 Jul, 2017 03:28 PM

   Hi Brett,

   that's done the trick! Nice one; this looks like it might have been a bit complicated!

   Thanks,

   Peter.

10. Support Staff 10 Brett on 07 Jul, 2017 05:05 PM

    Excellent, thanks for the help in finding the issue.

    -Brett