Codeblock improvements

[robdy]

Related with #732

TODO

• [x] Remove gatsby-remark-prismjs
• [x] Apply syntax highlighting in new CodeBlock
• [ ] Check if it works after build
• [ ] If not, perhaps use gatsby-browser.js

Notes

Using custom MDX element cause the items to be converted from AST to HTML elements. Therefore, gatsby-remark-prismjs doesn't pick them up. gatsby-remark-prismjs transfer nodes to HTML elements, too. Possible solutions: add prism to CodeBlock or use remark transformer plugin to manipulate HTML element. Or find a way for custom element to return the AST node

Perhaps check this code: https://github.com/zslabs/zslabs-v3

Solution with line wrap and numbering: https://stackoverflow.com/a/41354764/9902555

Helpful guide: https://dev.to/fidelve/the-definitive-guide-for-using-prismjs-in-gatsby-4708

[netlify[bot]]

✅ Deploy Preview for robdy-io ready!

Name	Link
🔨 Latest commit	f3d875705311906a0e09ea5db287953bae65dd73
🔍 Latest deploy log	https://app.netlify.com/sites/robdy-io/deploys/641abac0b2521d00087d3173
😎 Deploy Preview	https://deploy-preview-739--robdy-io.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.