docs(v2): wrap mdx usage in mdx-code-block (#5007)

website/docs/guides/docs/docs-create-doc.mdx

@@ -52,6 +52,7 @@ With `{#custom-id}` syntax you can set your own header id.
 
 This will render in the browser as follows:
 
+```mdx-code-block
 import BrowserWindow from '@site/src/components/BrowserWindow';
 
 <BrowserWindow url="http://localhost:3000">
@@ -81,3 +82,4 @@ The headers are well-spaced so that the hierarchy is clear.
 With <code>{#custom-id}</code> syntax you can set your own header id.
 
 </BrowserWindow>
+```

website/docs/guides/markdown-features/markdown-features-react.mdx

@@ -83,6 +83,7 @@ import MyComponentSource from '!!raw-loader!./myComponent';
 <CodeBlock className="language-jsx">{MyComponentSource}</CodeBlock>;
 ```
 
+```mdx-code-block
 import CodeBlock from '@theme/CodeBlock';
 import MyComponentSource from '!!raw-loader!@site/src/pages/examples/_myComponent';
 
@@ -93,6 +94,7 @@ import MyComponentSource from '!!raw-loader!@site/src/pages/examples/_myComponen
 </BrowserWindow>
 
 <br />
+```
 
 :::note
 
@@ -116,6 +118,7 @@ import Intro from './markdown-features-intro.mdx';
 <Intro />;
 ```
 
+```mdx-code-block
 import Intro from './markdown-features-intro.mdx';
 
 <BrowserWindow url="http://localhost:3000">
@@ -125,6 +128,7 @@ import Intro from './markdown-features-intro.mdx';
 </BrowserWindow>
 
 <br />
+```
 
 This way, you can reuse contents among multiple pages and avoid duplicating materials.
 

website/versioned_docs/version-2.0.0-beta.1/guides/docs/docs-create-doc.mdx

@@ -52,6 +52,7 @@ With `{#custom-id}` syntax you can set your own header id.
 
 This will render in the browser as follows:
 
+```mdx-code-block
 import BrowserWindow from '@site/src/components/BrowserWindow';
 
 <BrowserWindow url="http://localhost:3000">
@@ -81,3 +82,4 @@ The headers are well-spaced so that the hierarchy is clear.
 With <code>{#custom-id}</code> syntax you can set your own header id.
 
 </BrowserWindow>
+```

website/versioned_docs/version-2.0.0-beta.1/guides/markdown-features/markdown-features-react.mdx

@@ -83,6 +83,7 @@ import MyComponentSource from '!!raw-loader!./myComponent';
 <CodeBlock className="language-jsx">{MyComponentSource}</CodeBlock>;
 ```
 
+```mdx-code-block
 import CodeBlock from '@theme/CodeBlock';
 import MyComponentSource from '!!raw-loader!@site/src/pages/examples/_myComponent';
 
@@ -93,6 +94,7 @@ import MyComponentSource from '!!raw-loader!@site/src/pages/examples/_myComponen
 </BrowserWindow>
 
 <br />
+```
 
 :::note
 
@@ -116,6 +118,7 @@ import Intro from './markdown-features-intro.mdx';
 <Intro />;
 ```
 
+```mdx-code-block
 import Intro from './markdown-features-intro.mdx';
 
 <BrowserWindow url="http://localhost:3000">
@@ -125,6 +128,7 @@ import Intro from './markdown-features-intro.mdx';
 </BrowserWindow>
 
 <br />
+```
 
 This way, you can reuse contents among multiple pages and avoid duplicating materials.