Skip to content

Update code diff example #929

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jul 21, 2025
Merged

Update code diff example #929

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ce555ae
clarify diff setup
ethanpalm Jul 21, 2025
ca1ff8e
update example to `text`
ethanpalm Jul 21, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 17 additions & 5 deletions code.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@

Enable syntax highlighting by specifying the programming language after the opening backticks of a code block.

We use [Shiki](https://shiki.style/) for syntax highlighting and support all available languages. See the full list of [languages](https://shiki.style/languages) in Shiki's documentation.

Check warning on line 60 in code.mdx

View check run for this annotation

Mintlify / Mintlify Validation (mintlify) - vale-spellcheck

code.mdx#L60 

Did you really mean 'Shiki's'?

```java
class HelloWorld {
Expand Down Expand Up @@ -302,7 +302,19 @@

### Diff

Add single line comments with `[!code ++]` and `[!code --]` to mark added and removed lines. You can also mark multiple lines with a single comment, such as `[!code ++:3]` or `[!code --:5]`.
Show a visual diff of added or removed lines in your code blocks. Added lines are highlighted in green and removed lines are highlighted in red.

To create diffs, add these special comments at the end of lines in your code block:

- `// [!code ++]`: Mark a line as added (green highlight).
- `// [!code --]`: Mark a line as removed (red highlight).

For multiple consecutive lines, specify the number of lines after a colon:

- `// [!code ++:3]`: Mark the current line plus the next two lines as added.
- `// [!code --:5]`: Mark the current line plus the next four lines as removed.

The comment syntax must match your programming language (for example, `//` for JavaScript or `#` for Python).

```js Diff Example icon="code" lines
const greeting = "Hello, World!"; // [!code ++]
Expand All @@ -313,12 +325,12 @@
sayHello();
```

````mdx
````text
```js Diff Example icon="code" lines
const greeting = "Hello, World!"; // [\!code ++]
const greeting = "Hello, World!"; // [!code ++]
function sayHello() {
console.log("Hello, World!"); // [\!code --]
console.log(greeting); // [\!code ++]
console.log("Hello, World!"); // [!code --]
console.log(greeting); // [!code ++]
}
sayHello();
```
Expand Down
Loading