{"id":"f7aa234f2d0343a61852f4d719350e9849ae6b80bd127bd83add0b1abe5229bd","type":"Contented","path":"/markdown","modifiedDate":1686373756200,"sections":[],"fields":{"title":"Markdown Features","description":"The dialect of Markdown that is currently supported for contented","tags":["Markdown","Frontmatter","Admonitions","Mermaid"]},"html":"<nav class=\"toc\"><ol class=\"toc-level toc-level-1\"><li class=\"toc-item toc-item-h1\"><a class=\"toc-link toc-link-h1\" href=\"#markdown-features\">Markdown Features</a><ol class=\"toc-level toc-level-2\"><li class=\"toc-item toc-item-h2\"><a class=\"toc-link toc-link-h2\" href=\"#github-flavour-markdown\">GitHub Flavour Markdown</a></li><li class=\"toc-item toc-item-h2\"><a class=\"toc-link toc-link-h2\" href=\"#frontmatter\">Frontmatter</a></li><li class=\"toc-item toc-item-h2\"><a class=\"toc-link toc-link-h2\" href=\"#admonitions\">Admonitions</a></li><li class=\"toc-item toc-item-h2\"><a class=\"toc-link toc-link-h2\" href=\"#mermaid\">Mermaid</a></li></ol></li></ol></nav><h1 id=\"markdown-features\"><a aria-hidden=\"true\" tabindex=\"-1\" href=\"#markdown-features\"><span class=\"icon icon-link\"></span></a>Markdown Features</h1>\n<p>Contented <a href=\"https://www.npmjs.com/package/unified\" target=\"_blank\" rel=\"nofollow\">unified</a> processor pipeline.</p>\n<pre class=\"shiki\" style=\"background-color: #22272e\"><code><span class=\"line\"><span style=\"color: #ADBAC7\">processor</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(options.before)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkGfm)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkFrontmatter)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkParse)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkLink)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkDirective)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkDirectiveRehype)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(collectFields)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(resolveFields)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(validateFields)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(options.remarks)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(remarkRehype)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(options.rehypes)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeExternalLinks, { target: </span><span style=\"color: #96D0FF\">'_blank'</span><span style=\"color: #ADBAC7\"> })</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeSlug)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeAutolinkHeadings)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeToc)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeHeading)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeMermaid)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeShiki, { highlighter })</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(rehypeStringify)</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">  .</span><span style=\"color: #DCBDFB\">use</span><span style=\"color: #ADBAC7\">(options.after);</span></span></code></pre>\n<h2 id=\"github-flavour-markdown\"><a aria-hidden=\"true\" tabindex=\"-1\" href=\"#github-flavour-markdown\"><span class=\"icon icon-link\"></span></a>GitHub Flavour Markdown</h2>\n<p><a href=\"https://github.github.com/gfm/\" target=\"_blank\" rel=\"nofollow\">GitHub Flavored Markdown</a>, often shortened as GFM, is the dialect of Markdown that is\ncurrently supported for user content on GitHub.com and GitHub Enterprise.</p>\n<p>This formal specification, based on the CommonMark Spec, defines the syntax and semantics of this dialect.</p>\n<h2 id=\"frontmatter\"><a aria-hidden=\"true\" tabindex=\"-1\" href=\"#frontmatter\"><span class=\"icon icon-link\"></span></a>Frontmatter</h2>\n<pre class=\"shiki\" style=\"background-color: #22272e\"><code><span class=\"line\"><span style=\"color: #ADBAC7\">---</span></span>\n<span class=\"line\"><span style=\"color: #8DDB8C\">title</span><span style=\"color: #ADBAC7\">: </span><span style=\"color: #96D0FF\">Markdown Flavour</span></span>\n<span class=\"line\"><span style=\"color: #ADBAC7\">---</span></span></code></pre>\n<h2 id=\"admonitions\"><a aria-hidden=\"true\" tabindex=\"-1\" href=\"#admonitions\"><span class=\"icon icon-link\"></span></a>Admonitions</h2>\n<p>Admonitions with <code>remark-directive</code> and <code>remark-directive-rehype</code>.</p>\n<div class=\"admonitions\"><p>This is <code>div{class=\"admonitions\"}</code>.</p><pre><code class=\"language-markdown\">:::div{class=\"admonitions\"}\nThis is `div{class=\"admonitions\"}`.\n:::\n</code></pre></div>\n<div class=\"admonitions red\"><p>This is <code>div{class=\"admonitions red\"}</code>.</p><pre><code class=\"language-markdown\">:::div{class=\"admonitions red\"}\nThis is `div{class=\"admonitions red\"}`.\n:::\n</code></pre></div>\n<div class=\"admonitions yellow\"><p>This is <code>div{class=\"admonitions yellow\"}</code>.</p><pre><code class=\"language-markdown\">:::div{class=\"admonitions yellow\"}\nThis is `div{class=\"admonitions yellow\"}`.\n:::\n</code></pre></div>\n<div class=\"admonitions green\"><p>This is <code>div{class=\"admonitions green\"}</code>.</p><pre><code class=\"language-markdown\">:::div{class=\"admonitions green\"}\nThis is `div{class=\"admonitions green\"}`.\n:::\n</code></pre></div>\n<h2 id=\"mermaid\"><a aria-hidden=\"true\" tabindex=\"-1\" href=\"#mermaid\"><span class=\"icon icon-link\"></span></a>Mermaid</h2>\n<pre><code>```mermaid\ngraph LR\n    Start --> Stop\n```\n</code></pre>\n<div class=\"mermaid\">graph LR\n    Start --> Stop\n</div>\n<pre><code>```mermaid\n  graph TD;\n      A-->B;\n      A-->C;\n      B-->D;\n      C-->D;\n```\n</code></pre>\n<div class=\"mermaid\">  graph TD;\n      A-->B;\n      A-->C;\n      B-->D;\n      C-->D;\n</div>","headings":[{"depth":1,"id":"markdown-features","title":"Markdown Features","children":[{"depth":2,"id":"github-flavour-markdown","title":"GitHub Flavour Markdown","children":[]},{"depth":2,"id":"frontmatter","title":"Frontmatter","children":[]},{"depth":2,"id":"admonitions","title":"Admonitions","children":[]},{"depth":2,"id":"mermaid","title":"Mermaid","children":[]}]}]}