# markdown-it-kramdown-attrs

> Kramdown Style Attributes for Markdown-it

Latest version **0.1.0** (published 2016-10-24) · LicenseRef-license.txt license · 0 weekly downloads

## Install

```sh
npm install markdown-it-kramdown-attrs
pnpm add markdown-it-kramdown-attrs
yarn add markdown-it-kramdown-attrs
bun add markdown-it-kramdown-attrs
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2016-10-24 |
| First published | 2016-10-20 |
| Weekly downloads | 0 |
| License | LicenseRef-license.txt |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Known vulnerabilities | 0 (+2 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 8 |
| Author | Jordon Bedwell |
| Maintainers | envygeeks, jpatters |

## Links

- npm: https://www.npmjs.com/package/markdown-it-kramdown-attrs
- Repository: https://github.com/forestryio/markdown-it-kramdown-attrs
- Homepage: https://github.com/forestryio/markdown-it-kramdown-attrs#readme
- Issues: https://github.com/forestryio/markdown-it-kramdown-attrs/issues
- npm.io page: https://npm.io/package/markdown-it-kramdown-attrs

## Dependencies (2)

- [markdown-it](https://npm.io/package/markdown-it.md) ^8.0.1
- [shell-quote](https://npm.io/package/shell-quote.md) ^1.6.1

## Recent versions

- 0.1.0 (latest) — 2016-10-24
- 0.0.1 — 2016-10-20

## README

# Markdown-it Kramdown Attributes

Add a little bit of Kramdown love to your Markdown-it.

## Usage

```js
import KramdownAttrs from "markdown-it-kramdown-attrs"
import MarkdownIt from "markdown-it"

// --

renderer = new MarkdownIt()
renderer.use(
  KramdownAttrs
)
```

## Examples
### Inline Attributes with Parent attributes

```md
# ![Text](image.jpg){:.class1}
{:.class2}
```

```html
<h1 class="class2">
  <img src="image.jpg" alt="Text" class="class1">
</h1>
```

### Elements with Attributes

```md
Text {.class1}
```

```html
<p class="class1">
  Text
</p>
```

### Mixed `{:}` and `{:}` after new lines.

```md
Text {.class1}
{.class2}
{.class3}
```

```html
<p class="class1 class2 class3">
  Text
</p>
```

---

```md
# ![Text](image.jpg){:.class1}
{:.class2}
{:.class3}
{:.class4}
```

```html
<h1 class="class2 class3 class4">
  <img src="img.jpg" alt="Text" class="class1">
</h1>
```

### Multiple in `{:}`

```md
# ![Text](image.jpg){:.class1 .class2}
{:.class3 .class4}
```

```html
<h1 class="class3 class4">
  <img src="img.jpg" alt="Text" class="class1 class2">
</h1>
```

---
_Source: https://npm.io/package/markdown-it-kramdown-attrs · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._