Merge pull request #451 from picturepan2/0.5.2

0.5.2

1 files changed, 22 insertions, 0 deletions

diff --git a/docs/src/contents/code.pug b/docs/src/contents/code.pug
new file mode 100644
index 0000000..f1ee876
--- /dev/null
+++ b/docs/src/contents/code.pug
@@ -0,0 +1,22 @@
+p Code is used for styling inline and multiline code snippets.
+p
+  | For inline code, you can use the #{'<code>'} element. 
+  | For multiline code snippet blocks, you can use #{'<pre>'} with the #[code code] class as a container, and add #{'<code>'} inside it.
+  | The #[code data-lang] ibute is rendered as the language name in the top right.
+
+pre.code(data-lang='HTML')
+  code
+    :highlight(lang="html")
+      <!-- code snippets -->
+      <button class="btn">
+        Submit
+      </button>
+
+pre.code(data-lang='HTML')
+  code
+    :highlight(lang="html")
+      <pre class="code" data-lang="HTML"><code><span class="com">&lt;!-- code snippets --&gt;</span>
+      &lt;<span class="tag">button</span> <span class="atn">class</span>=<span class="atv">&quot;btn&quot;</span>&gt;
+        Submit
+      &lt;<span class="tag">/button</span>&gt;
+      </code></pre>
\ No newline at end of file