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.

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

Replace the line highlighting logic with Shiki lineOptions #1152

Merged
merged 2 commits into from
Aug 9, 2022

Conversation

Jinjiang
Copy link
Member

@Jinjiang Jinjiang commented Aug 9, 2022

Re-implemented line highlighting logic according to @octref's approach vuejs/theme#41

Changes:

  • src/node/markdown/plugins/highlightLines.ts: only normalize the line info and append it back to token.info
  • src/node/markdown/plugins/highlight.ts: parse the normalized line info into lineOptions and pass it into shiki.
  • src/client/theme-default/styles/components/vp-doc.css: style update accordingly to code blocks

Thanks.

@brc-dd
Copy link
Member

brc-dd commented Aug 9, 2022

@Jinjiang
Copy link
Member Author

Jinjiang commented Aug 9, 2022

The UI has certain issues:

image

https://deploy-preview-1152--vitepress-docs.netlify.app/guide/markdown.html#line-highlighting-in-code-blocks

Sorry I found it too. Fixed already. 🙏

@brc-dd brc-dd merged commit e8cb73e into vuejs:main Aug 9, 2022
@Jinjiang Jinjiang deleted the shiki-line-highlighting branch August 9, 2022 19:05
@brc-dd
Copy link
Member

brc-dd commented Aug 15, 2022

IG we missed some UI issues here:

On https://deploy-preview-1152--vitepress-docs.netlify.app/guide/using-vue.html (and current vitepress.vuejs.org too), there are padding issues:

image

Also, new lines in code blocks aren't being respected:

image

Earlier it was like this (you can use some older PR deploy like https://deploy-preview-1132--vitepress-docs.netlify.app/guide/using-vue.html to see):

image

Text that is directly contained inside a flex container is automatically wrapped in an anonymous flex item. However, an anonymous flex item that contains only white space is not rendered, as if it were designated display: none.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Jan 21, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants