search

kelyvin / ghost-caffeine-theme

A minimalist, Material Design inspired Ghost Theme for optimal desktop and mobile experiences
https://caffeinecoding.com
MIT License
333 stars 97 forks source link

Word Wrap didn't work in <code> area #10

Closed smoki99 closed 8 years ago

smoki99 commented 8 years ago

Hi there,

I had to add the following CSS to make "code" areas looking well in Chrome.

pre>code {
     white-space: pre-line !important;
}

Maybe it would be good to make a change in CSS for this.

Kind Regards,

Christian

kelyvin commented 8 years ago

Hi @smoki99,

Sorry for the late reply, I have been on vacation and just got back.

Thanks a bunch for the bug catch. This theme comes packaged with prism.js, which usually fixes most code wrapping issues if you take advantage of it. I recommend using that religiously for any code block, but for code blocks where prismjs is not used, I started seeing the issues you encountered.

So to remediate this issue, I have checked in a fix for it. Adding your recommended code block only solves half the issue, so I have decided to add the following line instead to pre>code:

white-space: pre-wrap;

This will ensure that it doesn't override the prism.js defaults, and also makes sure that plain code blocks are still indented and formatted into a human readable form. I have checked this in with the latest v2.7.6 release.

Thanks for your patience and all the help!