Living Styleguide

Version 0.14.5

2.2.7 #DocumentationGuide.BeyondBasics.HighlightMarkup

Highlighting Markup Code

HighlightMarkup allows basic regular expressions (i.e. no fancy stuff like look ahead, look behind, etc) to be used to highlight keywords in the Markup block.

🛑 Important: Only applicable to CSS classnames that are found within the class attribute.

// ...
//
// HighlightMarkup: kss-demo(-\w+)?
//
// Markup: <button class="kss-demo kss-demo-btn">Button</button>
//
//...

Notice that in the Markup block, the CSS classnames kss-demo and kss-demo-btn are highlighted.

📝 Note: Remember to properly escape special characters (with a \) if you intend to use them as literal characters.

💡 Tip: It also works with Partials.

Example
Markup
<button class="kss-demo kss-demo-btn">Button</button>