Skip to content

Commit 666adcf

Browse files
committed
line highlighting and focusing
1 parent 0e96132 commit 666adcf

File tree

1 file changed

+23
-6
lines changed

1 file changed

+23
-6
lines changed

code.mdx

Lines changed: 23 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ class HelloWorld {
4444
* **Expression options**: Wrap with `{}`, `""`, or `''`.
4545

4646
## Syntax highlighting
47-
Enable syntax highlighting by specifying the programming language after the opening backticks of a code block. The language name is a string.
47+
Enable syntax highlighting by specifying the programming language after the opening backticks of a code block.
4848

4949
```java
5050
class HelloWorld {
@@ -164,7 +164,7 @@ We use [Shiki](https://shiki.style/languages) for syntax highlighting and suppor
164164
</table>
165165

166166
## Title
167-
Add a title after the programming language to label a code example. Titles can be any string on a single line.
167+
Add a title after the programming language to label your code example. Titles can be any string on a single line.
168168

169169
```javascript Code Block Example
170170
const hello = "world";
@@ -177,7 +177,7 @@ const hello = "world";
177177
````
178178

179179
## Icon
180-
Add an icon to a code block using a string. You can use FontAwesome icons, Lucide icons, or icons with absolute URLs.
180+
Add an icon to your code block. You can use FontAwesome icons, Lucide icons, or absolute URLs.
181181

182182
```javascript icon="globe"
183183
const hello = "world";
@@ -190,8 +190,7 @@ const hello = "world";
190190
````
191191

192192
## Line Highlighting
193-
TODO: - highlight `expression | string`: `{1, 3-5}` or `"1, 4-5"`
194-
Highlight specific lines in your code blocks by adding a special comment after the language identifier. Use curly braces `{}` and specify line numbers or ranges separated by commas.
193+
Highlight specific lines in your code blocks using `highlight` with the line numbers or ranges you want to highlight.
195194

196195
```javascript Line Highlighting Example {1,3-5}
197196
const greeting = "Hello, World!";
@@ -212,7 +211,25 @@ sayHello();
212211
````
213212

214213
## Line focusing
215-
TODO: - focus `expression | string`: `{1, 3-5}` or `"1, 4-5"`
214+
Focus on specific lines in your code blocks using `focus` with line numbers or ranges.
215+
216+
```javascript Line Focus Example {2,4-5}
217+
const greeting = "Hello, World!";
218+
function sayHello() {
219+
console.log(greeting);
220+
}
221+
sayHello();
222+
```
223+
224+
````md
225+
```javascript Line Focus Example {2,4-5}
226+
const greeting = "Hello, World!";
227+
function sayHello() {
228+
console.log(greeting);
229+
}
230+
sayHello();
231+
```
232+
````
216233

217234
## Show line numbers
218235
TODO: - showLineNumbers `boolean`

0 commit comments

Comments
 (0)