Highlight challenge codeblock and inline-code

[flacial]

Description

The code in our challenges whether a code block or an inline code is hard to read because it lacks syntax highlighting and no background to distinguish it from other text.

Changes

• Update ChallengeMaterial component to override pre and code elements to our markdown components
• Update snapshots

Screenshots

Before

After

Testing

1. Go to any curriculum challenges with a codeblock or inline-code.
2. Confirm the syntax is highlighted

Related issues

• Closes Challenge code blocks are not highlighted #2819

[vercel]

@flacial is attempting to deploy a commit to the c0d3-prod Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
c0d3-app	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Mar 24, 2023 at 7:51PM (UTC)

[codecov]

Codecov Report

Merging #2840 (9d7b1ce) into master (f32f02c) will not change coverage.
The diff coverage is 100.00%.

❗ Current head 9d7b1ce differs from pull request most recent head a9d0db0. Consider uploading reports for the commit a9d0db0 to get more accurate results

@@            Coverage Diff            @@
##            master     #2840   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          189       189           
  Lines         3562      3567    +5     
  Branches       970       970           
=========================================
+ Hits          3562      3567    +5     

Impacted Files	Coverage Δ
components/mdx/CodeBlock.tsx	100.00% <ø> (ø)
components/ChallengeMaterial/ChallengeMaterial.tsx	100.00% <100.00%> (ø)