Added custom container plugin demo

Makefile

@@ -29,6 +29,7 @@ demo: lint
 	cp ./support/demo_template/README.md ./demo/
 	mkdir ./demo/plugins
 	cp ./node_modules/markdown-it-abbr/dist/* ./demo/plugins
+	cp ./node_modules/markdown-it-container/dist/* ./demo/plugins
 	cp ./node_modules/markdown-it-deflist/dist/* ./demo/plugins
 	cp ./node_modules/markdown-it-emoji/dist/* ./demo/plugins
 	cp ./node_modules/markdown-it-footnote/dist/* ./demo/plugins

package.json

@@ -37,6 +37,7 @@
     "istanbul": "*",
     "jade": "~1.9.2",
     "markdown-it-abbr": "^1.0.0",
+    "markdown-it-container": "^1.0.0",
     "markdown-it-deflist": "^1.0.0",
     "markdown-it-emoji": "^1.0.0",
     "markdown-it-footnote": "^1.0.0",

support/demo_template/index.jade

@@ -21,6 +21,7 @@ html
     script(src='https://twemoji.maxcdn.com/twemoji.min.js')
 
     script(src='plugins/markdown-it-abbr.js')
+    script(src='plugins/markdown-it-container.js')
     script(src='plugins/markdown-it-deflist.js')
     script(src='plugins/markdown-it-emoji.js')
     script(src='plugins/markdown-it-footnote.js')

support/demo_template/index.js

@@ -60,6 +60,7 @@
     } else {
       mdHtml = window.markdownit(defaults)
                   .use(window.markdownitAbbr)
+                  .use(window.markdownitContainer, 'warning')
                   .use(window.markdownitDeflist)
                   .use(window.markdownitEmoji)
                   .use(window.markdownitFootnote)
@@ -69,6 +70,7 @@
                   .use(window.markdownitSup);
       mdSrc = window.markdownit(defaults)
                   .use(window.markdownitAbbr)
+                  .use(window.markdownitContainer, 'warning')
                   .use(window.markdownitDeflist)
                   .use(window.markdownitEmoji)
                   .use(window.markdownitFootnote)

support/demo_template/index.styl

@@ -89,6 +89,12 @@ body
 .footnotes-list
   padding-left 2em
 
+// custom container
+.warning
+  background-color #ff8
+  padding 20px
+  border-radius 6px
+
 .gh-ribbon
   display block
   position absolute

support/demo_template/sample.md

@@ -237,3 +237,9 @@ This is HTML abbreviation example.
 It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on.
 
 *[HTML]: Hyper Text Markup Language
+
+### [Custom containers](https://github.com/markdown-it/markdown-it-container)
+
+::: warning
+*here be dragons*
+:::