From 95b685289a53554b8474fe78043ae1c8ec3d9f9d Mon Sep 17 00:00:00 2001
From: Etienne Fuchs <100560425+fuchse-ego@users.noreply.github.com>
Date: Mon, 28 Oct 2024 14:16:33 +0100
Subject: [PATCH] Add code.md to show how to highlight line numbers. (#1135)

---
 docs/_sidebar.md      |  4 ++--
 docs/markdown/code.md | 28 ++++++++++++++++++++++++++++
 2 files changed, 30 insertions(+), 2 deletions(-)
 create mode 100644 docs/markdown/code.md

diff --git a/docs/_sidebar.md b/docs/_sidebar.md
index 091cff40..36693c64 100644
--- a/docs/_sidebar.md
+++ b/docs/_sidebar.md
@@ -8,7 +8,7 @@
   - [Extended Syntax](markdown/extended-syntax.md)
   - Backgrounds
   - Media
-  - Code
+  - [Code](markdown/code.md)
   - Math
   - Fragments
   - Links
@@ -44,7 +44,7 @@
   - Reference
 
 - Reference
- 
+
   - [API](api.md)
   - [Configuration](configuration.md)
 
diff --git a/docs/markdown/code.md b/docs/markdown/code.md
new file mode 100644
index 00000000..f9d59829
--- /dev/null
+++ b/docs/markdown/code.md
@@ -0,0 +1,28 @@
+# Code
+
+## Sigle line
+```markdown
+`single line of code`
+```
+
+## Code block
+```markdown
+    ```js
+    class Person(){
+        #name = "Jhon Doe"
+    }
+    ```
+
+```
+
+## Line Numbers & Highlights
+Use the revealjs `<code data-line-numbers>` attribute from [their documentation](https://revealjs.com/code/):
+```markdown
+    ```js {data-line-numbers}
+    class Person(){
+        #name = "Jhon Doe"
+        #job = "Accounting"
+    }
+
+```
+Using these you can highlight line numbers (`{data-line-numbers="2,3"}`) and also create step-by-step fragments ((`{data-line-numbers="2|3"}`)).