Skip to content

Instantly share code, notes, and snippets.

@imjasonh
Last active February 12, 2024 17:18
Show Gist options
  • Save imjasonh/c00cdd7aece6945fb8ea to your computer and use it in GitHub Desktop.
Save imjasonh/c00cdd7aece6945fb8ea to your computer and use it in GitHub Desktop.
Render Markdown as unrendered Markdown (see http://jsbin.com/huwosomawo)
* {
font-size: 12pt;
font-family: monospace;
font-weight: normal;
font-style: normal;
text-decoration: none;
color: black;
cursor: default;
}
h1::before { content: "# "; }
h2::before { content: "## "; }
h3::before { content: "### "; }
h4::before { content: "#### "; }
h5::before { content: "##### "; }
h6::before { content: "###### "; }
strike::after, strike::before { content: "~~"; }
i::before, i::after { content: "*"; }
b::before, b::after { content: "**"; }
ol, ul { list-style: none; padding-left: 0; }
ul li::before { content: "* "; }
ol li::before { content: "1. "; }
code::before, code::after { content: "`"; }
pre::before { content: "```" attr(lang) "\A"; }
pre::after { content:"```\A"; }
a::before { content: "["; }
a::after { content: "](" attr(href) ")"; }
tr::before { content: "| "; }
td::after { content: " | "; }
thead td::after { content: " | \A-----| "; white-space: pre; }
@tcelestino
Copy link

amazing!
👏

@daftspaniel
Copy link

Funky!

@Pierstoval
Copy link

There should be something done for the pre code {} selector which is created in some Markdown parsers (especially when you have a language specified in the "```" block)

@afolson
Copy link

afolson commented May 21, 2015

I'd like to add my voice to the chorus of people suggesting that this become a repo. :D

@jslegers
Copy link

When I try to actually copy/paste/select the generated characters, both Firefox and Chrome consistently skip any generated characters.

Judging by what I find on Stackoverflow, the problem seems to be neither OS nor browser specific :

That means you'll still need a nasty JS-based hack to actually copy-paste the generated output into a textarea on Github or elsewhere.


Workaround:

  1. Use Google Chrome
  2. Go to the print preview
  3. Copy-paste your result from the print preview

This technique is a bit convoluted, but it appears to be the best we've got so far.

Copy link

ghost commented Jun 4, 2015

Awesome :)

@hboon
Copy link

hboon commented Oct 5, 2015

Thanks for sharing, ever since I saw this, I've been meaning to find a place to use it. I've just applied this lightly at https://motionobj.com/wilfredapp/.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment