remarkable-highlight-lines v0.0.1

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.