feat(docs): highlight code block

[zhangmo8]

🔗 Linked issue

close #829

❓ Type of change

• 📖 Documentation (updates to the documentation, readme or JSdoc annotations)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

highlight the demo code block

📸 Screenshots (if appropriate)

before:

after:

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[sadeghbarati]

#372

[zhangmo8]

shadcn has code theme now @sadeghbarati

Do I need to change it to the same theme as him?

[sadeghbarati]

Ahh, yes You are right, please go with github-dark-default light-mode for code section is a bit odd

[zhangmo8]

Hi @sadeghbarati I looked up the mdx themes used by shadcn, and I thought if we could add a code theme option to the header so that users could choose their favorite code theme

Now it's

[zhangmo8]

Maybe it will be like this. What do you think? @sadeghbarati

[sadeghbarati]

@zhangmo8 It's nice to have this, but I think one code theme is enough
I'm in your branch right now and using shiki/themes/github-dark-default.mjs

[zhangmo8]

@zhangmo8 It's nice to have this, but I think one code theme is enough I'm in your branch right now and using shiki/themes/github-dark-default.mjs

Alright, I've changed the theme to github-xx-default. If needed, I can submit the code for the theme switching functionality later.

[sadeghbarati]

Thanks 🙏

[sadeghbarati]

@zhangmo8 Could you please check BlockContainer.vue seems to be using the previous shiki way cssVariables

[zhangmo8]

It seems that I have missed something. Sorry for any inconvenience caused. I will submit another pull request to fix it. @sadeghbarati