docs: add Vercel docs highlighting

[dbzx10299]

The Comark docs look quite nice already, but since the Comark docs layer is meant to look similar to Vercel, I added highlighting just like the Vercel docs use. I did this with Shiki's cssVars theme and also with Rangi's css theme. The benefit to this is that we can use the oklch color space to make the colors pop a lot more.

Shiki's css color theme does seem to tokenize the code a bit more than Rangi but given Rangi's small size it may be a better tradeoff to keep it. If we use Shiki in the api route we would have 1:1 highlighting with Vercel.

I also made sure this uses the light and dark oklch theme variables.

[vercel]

@dbzx10299 is attempting to deploy a commit to the NuxtLabs Team on Vercel.

A member of the Team first needs to authorize it.

[atinux]

BTW I updated to use rangi for the demo components and fixed the font-size for code blocks similar to Vercel docs.

[pkg-pr-new]

npm i https://pkg.pr.new/comarkdown/comark-docs@30

commit: b408411

[dbzx10299]

@atinux I noticed a few things - after this was merged some code blocks seemed to be using the dark tokens but it looks like you have that fixed. The Rangi syntax highlighter does not tokenize the code snippets as well as Shiki, which Vercel also uses so we would have 1:1 with their theme and since this is ISR, even if Shiki is a bit larger I imagine it would be alright.

The other thing is Rangi has a geist theme but it uses hex. The last thing is if we used Shiki, the cssVars theme is slightly better but it doesn't seem to work the best with raw markdown snippet highlighting and github dark is not too different, that may have better highlighting.

[atinux]

I fixed it in 38a4f11 @dbzx10299

Honestly I don't mind using hex and not be 1:1 with Geist docs

[dbzx10299]

@atinux The code blocks on the Comark homepage have a color that is not in the geist theme you wrote. I haven't had time to dig into it but I might open a pull request, it could be that in the server/api/code-explorer/[...path].get.ts file it's still importing and using the cssVars theme or it could be coming from the cache since the plugin changed and we never updated the CONTENT_PARSER_VERSION in the cache.ts file.