Skip to content
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

Jump to bottom

docs(en): clarify code highlighting & fix typos #1604

Closed
wants to merge 1 commit into from
Closed

docs(en): clarify code highlighting & fix typos #1604

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
16 changes: 8 additions & 8 deletions docs/guide/markdown.md
View file
Open in desktop
Expand Up @@ -351,7 +351,7 @@ export default { // Highlighted
}
```

Alternatively, it's possible to highlight directly in the line by using the `// [!code hl]` comment.
Alternatively, it's possible to highlight directly in the line by using the `// [!code hl]` comment. Available since [1.0.0-alpha.23](https://github.com/vuejs/vitepress/blob/main/CHANGELOG.md#100-alpha23-2022-10-25).

**Input**

Expand All @@ -360,7 +360,7 @@ Alternatively, it's possible to highlight directly in the line by using the `//
export default {
data () {
return {
msg: 'Highlighted!' // [!codeㅤ hl]
msg: 'Highlighted!' // [!codeㅤhl]
}
}
}
Expand All @@ -383,7 +383,7 @@ export default {

Adding the `// [!code focus]` comment on a line will focus it and blur the other parts of the code.

Additionally, you can define a number of lines to focus using `// [!code focus:<lines>]`.
Additionally, you can define a number of lines to focus using `// [!code focus:<lines>]` like `// [!code focus:5]`, to focus the following five lines starting from the row where the code is placed.

**Input**

Expand All @@ -392,7 +392,7 @@ Additionally, you can define a number of lines to focus using `// [!code focus:<
export default {
data () {
return {
msg: 'Focused!' // [!codeㅤ focus]
msg: 'Focused!' // [!codeㅤfocus]
Copy link
Member

@brc-dd brc-dd Nov 13, 2022 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is not a space either. It's U+3164. Having such characters in source code is worse than having two spaces. It is more likely to go unnoticed than two spaces!

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh right, didn't see that - nor did my editor apparently! Thanks for pointing it out.

Copy link
Member

@brc-dd brc-dd Nov 16, 2022 •
edited

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I missed that too. It is there in the current docs too. I'd missed them while reviewing earlier PRs. Gonna remove all those in #1615 itself. Removing two spaces won't work as it will make shiki highlight those blocks too. We can however add a note there that users should remove an extra space if copying.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think mentioning removing the extra spaces is helpful because it took me about 20 minutes to figure out why on earth it didn't work 😅

}
}
}
Expand Down Expand Up @@ -422,8 +422,8 @@ Adding the `// [!code --]` or `// [!code ++]` comments on a line will create a d
export default {
data () {
return {
msg: 'Removed' // [!codeㅤ --]
msg: 'Added' // [!codeㅤ ++]
msg: 'Removed' // [!code --]
msg: 'Added' // [!codeㅤ++]
}
}
}
Expand Down Expand Up @@ -454,8 +454,8 @@ Adding the `// [!code warning]` or `// [!code error]` comments on a line will co
export default {
data () {
return {
msg: 'Error', // [!codeㅤ error]
msg: 'Warning' // [!codeㅤ warning]
msg: 'Error', // [!codeㅤerror]
msg: 'Warning' // [!codeㅤwarning]
}
}
}
Expand Down