remarkable-highlight-lines
v0.0.1
Published
Highlight specific lines in code blocks using Remarkable.
Downloads
6
Readme
remarkable-highlight-lines
Install
yarn add remarkable-highlight-lines
Usage
const Remarkable = require('remarkable');
const highlightLines = require('remarkable-highlight-lines')
const md = new Remarkable();
md.use(highlightLines)
md.render(markdownString)
Example
To highlight line 1, and lines 3 through 5:
```js {1,3-5}
function foo() {
return bar()
.then(res => {
return res.doSomething()
})
}
```
Note that the spaces between language name and opening curly bracket are optional.
Each highlighted line will be wrapped in <span class="highlighted-line"></span>
, you can apply some custom styles to this element, recommended:
pre, pre[class*="language-"] {
padding: 1.575rem;
white-space: pre-wrap;
word-break: break-word;
margin: 30px 0;
color: white;
overflow: auto;
}
.highlighted-line {
background-color: #14161a;
display: block;
margin: 0 -1.575rem;
padding: 0 1.575rem;
}
Credits
Many thanks to EGOIST and the markdown-it-highlight-lines repo. MIT License.