support for <kbd> and <samp>

Hey, I really like Prism—you’ve done a good job and making it simple and “just work” (for the most part, which is must more than I can say about most software out there nowadays).

I had a thought, and I’m not 100% of my opinion on this, but… currently you only support <code>, which is completely correct for source code blocks. I was already using <pre><code> in fact.

But to be pedantic, HTML5 says we should use <kbd> for user input (such as the command-line stuff) and <samp> for program output. So for for programming language source code, we’re good, but for the command-line or sample output… HTML5 wants us to use other tags. See:

• https://www.w3.org/TR/html5/text-level-semantics.html
• http://www.iandevlin.com/blog/2012/07/html5/using-html-kbd-samp-and-pre-elements

I know that <kbd> and <samp> aren’t widespread, and that everybody tries to cram everything like this into <code> (as I used to do), but what are your thoughts on supporting <kbd> and <samp> when it’s semantically appropriate?

Cheers,

Garret

[LeaVerou]

Gawd I can’t wait for :matches(). Once :matches() is supported, that would just be:

Prism.hooks.add('before-highlightall', function (env) {
	env.selector += ", :matches([class*='lang-'], [class*='language-']) :matches(kbd, samp)";
});

[Golmote]

So the official way to do this is something along the lines of:

Prism.hooks.add('before-highlightall', function (env) {
	env.selector += ", [class*='lang-'] kbd, [class*='language-'] kbd" +
		", kbd[class*='lang-'], kbd[class*='language-']" +
		", [class*='lang-'] samp, [class*='language-'] samp" +
		", samp[class*='lang-'], samp[class*='language-']";
});

Alternatively, env.elements can be set directly to the set of elements that are to be highlighted.