Change syntax highlighting in documentation site

[paulwongx]

For some reason, reading the react-hook-form docs is always very tiring and it feels draining after reading a few pages. I always thought it was me but I realized today the color syntax highlighting is totally off.

All the unimportant things are highlighted in red and yellow and everything important to distinguish is all in white. This causes a tremendous amount of cognitive load and energy to process the docs. Can we change the syntax so it uses a standard syntax highlighting? Like tailwind docs or zustand docs?

For example, the code below:

• Red: The most unimportant things that you don't need to focus on. All of these are generic too.
• Yellow: Slightly more important than red, but absolutely nothing that you need to focus on to understand the code
• White: Everything that is unique and important to understand the code

This is an absolute anti-pattern. So please, can we change the syntax highlighting so millions of people's lives are easier?

[bluebill1049]

You can switch to light mode if that helps. or feel free to play around with the primsajs and send us a PR to improve.

[haykerman]

Adding to this issue. If possible, please, change the font to be Fira Code or something similar. Will make it easier to read.

[Perlence]

The problem with switching to light mode is that it's even harder to read. Pink and especially yellow have very little contrast against the white background.