Org.css

A perverse way to make your HTML look like org-mode, purely via CSS.

Use the orrg.css file to make regular HTML look like plain-text markdown. No JavaScript hacks are needed.

The styles are written in org.less. If you want to hack on this project, you can convert the less files to css with build.sh or run the watch_less.sh script to have it auto-update when the files change.

---

bla bla change below

This is built to support all of the standard markdown elements with a few minor issues.

Issues:

• repeats for h1, hr, and blockquote use characters that are repeated 100 times, so width greater than 100 characters or a blockquote more than a 100 lines will not be perfect
• pseudo elements (:before, :after) don’t work with images (except opera), so I didn’t support making images look like markdown

Bookmarklet

Try out the experimental bookmarklet, linked at the bottom of the demo. Created in the bookmarklet generator with the following code and a jquery include:

$('link[rel=stylesheet]').add('style').remove();
$('[style]').attr('style', '');
$('head').append('<link rel="stylesheet" href="http://mrcoles.com/media/test/markdown-css/markdown.css" type="text/css" />');
$('body').addClass('markdown').css({width: '600px', margin: '2em auto', 'word-wrap': 'break-word'});
$('a img').css({'max-height': '1em', 'max-width': '1em'});