docs(v2): escape more jsx in mdx files for Crowdin (#4285)

This commit is contained in:
Sébastien Lorber 2021-02-24 15:46:00 +01:00 committed by GitHub
parent 96e1b1e269
commit cc42cf5af7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 50 additions and 0 deletions

View file

@ -396,6 +396,7 @@ class HelloWorld {
And you will get the following: And you will get the following:
````mdx-code-block
<Tabs <Tabs
defaultValue="js" defaultValue="js"
values={[ values={[
@ -433,6 +434,7 @@ class HelloWorld {
</TabItem> </TabItem>
</Tabs> </Tabs>
````
You may want to implement your own `<MultiLanguageCode />` abstraction if you find the above approach too verbose. We might just implement one in future for convenience. You may want to implement your own `<MultiLanguageCode />` abstraction if you find the above approach too verbose. We might just implement one in future for convenience.

View file

@ -21,6 +21,7 @@ import TOCInline from '@theme/TOCInline';
<TOCInline toc={toc} />; <TOCInline toc={toc} />;
``` ```
```mdx-code-block
import TOCInline from '@theme/TOCInline'; import TOCInline from '@theme/TOCInline';
<BrowserWindow> <BrowserWindow>
@ -28,6 +29,7 @@ import TOCInline from '@theme/TOCInline';
<TOCInline toc={toc} /> <TOCInline toc={toc} />
</BrowserWindow> </BrowserWindow>
```
## Custom table of contents ## Custom table of contents
@ -54,11 +56,13 @@ import TOCInline from '@theme/TOCInline';
/>; />;
``` ```
```mdx-code-block
<BrowserWindow> <BrowserWindow>
<TOCInline toc={[toc[2], toc[4]]} /> <TOCInline toc={[toc[2], toc[4]]} />
</BrowserWindow> </BrowserWindow>
```
--- ---

View file

@ -30,6 +30,7 @@ import TabItem from '@theme/TabItem';
And you will get the following: And you will get the following:
```mdx-code-block
<Tabs <Tabs
defaultValue="apple" defaultValue="apple"
values={[ values={[
@ -41,6 +42,7 @@ And you will get the following:
<TabItem value="orange">This is an orange 🍊</TabItem> <TabItem value="orange">This is an orange 🍊</TabItem>
<TabItem value="banana">This is a banana 🍌</TabItem> <TabItem value="banana">This is a banana 🍌</TabItem>
</Tabs> </Tabs>
```
:::info :::info
@ -78,6 +80,7 @@ You may want choices of the same kind of tabs to sync with each other. For examp
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -99,6 +102,7 @@ You may want choices of the same kind of tabs to sync with each other. For examp
<TabItem value="win">Use Ctrl + V to paste.</TabItem> <TabItem value="win">Use Ctrl + V to paste.</TabItem>
<TabItem value="mac">Use Command + V to paste.</TabItem> <TabItem value="mac">Use Command + V to paste.</TabItem>
</Tabs> </Tabs>
```
For all tab groups that have the same `groupId`, the possible values do not need to be the same. If one tab group with chooses an value that does not exist in another tab group with the same `groupId`, the tab group with the missing value won't change its tab. You can see that from the following example. Try to select Linux, and the above tab groups doesn't change. For all tab groups that have the same `groupId`, the possible values do not need to be the same. If one tab group with chooses an value that does not exist in another tab group with the same `groupId`, the tab group with the missing value won't change its tab. You can see that from the following example. Try to select Linux, and the above tab groups doesn't change.
@ -117,6 +121,7 @@ For all tab groups that have the same `groupId`, the possible values do not need
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -129,6 +134,7 @@ For all tab groups that have the same `groupId`, the possible values do not need
<TabItem value="mac">I am macOS.</TabItem> <TabItem value="mac">I am macOS.</TabItem>
<TabItem value="linux">I am Linux.</TabItem> <TabItem value="linux">I am Linux.</TabItem>
</Tabs> </Tabs>
```
--- ---
@ -160,6 +166,7 @@ Tab choices with different `groupId`s will not interfere with each other:
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -181,6 +188,7 @@ Tab choices with different `groupId`s will not interfere with each other:
<TabItem value="win">Windows is windows.</TabItem> <TabItem value="win">Windows is windows.</TabItem>
<TabItem value="unix">Unix is unix.</TabItem> <TabItem value="unix">Unix is unix.</TabItem>
</Tabs> </Tabs>
```
## Customizing tabs ## Customizing tabs
@ -204,6 +212,7 @@ import TabItem from '@theme/TabItem';
</Tabs>; </Tabs>;
``` ```
```mdx-code-block
<Tabs <Tabs
className="unique-tabs" className="unique-tabs"
defaultValue="apple" defaultValue="apple"
@ -216,3 +225,4 @@ import TabItem from '@theme/TabItem';
<TabItem value="orange">This is an orange 🍊</TabItem> <TabItem value="orange">This is an orange 🍊</TabItem>
<TabItem value="banana">This is a banana 🍌</TabItem> <TabItem value="banana">This is a banana 🍌</TabItem>
</Tabs> </Tabs>
```

View file

@ -65,6 +65,7 @@ The headers are well-spaced so that the hierarchy is clear.
This will render in the browser as follows: This will render in the browser as follows:
```mdx-code-block
import BrowserWindow from '@site/src/components/BrowserWindow'; import BrowserWindow from '@site/src/components/BrowserWindow';
<BrowserWindow url="http://localhost:3000"> <BrowserWindow url="http://localhost:3000">
@ -90,6 +91,7 @@ The headers are well-spaced so that the hierarchy is clear.
- multiple times - multiple times
</BrowserWindow> </BrowserWindow>
```
## Markdown headers ## Markdown headers
@ -286,6 +288,7 @@ import TabItem from '@theme/TabItem';
And you will get the following: And you will get the following:
```mdx-code-block
<Tabs <Tabs
defaultValue="apple" defaultValue="apple"
values={[ values={[
@ -297,6 +300,7 @@ And you will get the following:
<TabItem value="orange">This is an orange 🍊</TabItem> <TabItem value="orange">This is an orange 🍊</TabItem>
<TabItem value="banana">This is a banana 🍌</TabItem> <TabItem value="banana">This is a banana 🍌</TabItem>
</Tabs> </Tabs>
```
:::info :::info
@ -334,6 +338,7 @@ You may want choices of the same kind of tabs to sync with each other. For examp
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -355,6 +360,7 @@ You may want choices of the same kind of tabs to sync with each other. For examp
<TabItem value="win">Use Ctrl + V to paste.</TabItem> <TabItem value="win">Use Ctrl + V to paste.</TabItem>
<TabItem value="mac">Use Command + V to paste.</TabItem> <TabItem value="mac">Use Command + V to paste.</TabItem>
</Tabs> </Tabs>
```
For all tab groups that have the same `groupId`, the possible values do not need to be the same. If one tab group with chooses an value that does not exist in another tab group with the same `groupId`, the tab group with the missing value won't change its tab. You can see that from the following example. Try to select Linux, and the above tab groups doesn't change. For all tab groups that have the same `groupId`, the possible values do not need to be the same. If one tab group with chooses an value that does not exist in another tab group with the same `groupId`, the tab group with the missing value won't change its tab. You can see that from the following example. Try to select Linux, and the above tab groups doesn't change.
@ -373,6 +379,7 @@ For all tab groups that have the same `groupId`, the possible values do not need
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -385,6 +392,7 @@ For all tab groups that have the same `groupId`, the possible values do not need
<TabItem value="mac">I am macOS.</TabItem> <TabItem value="mac">I am macOS.</TabItem>
<TabItem value="linux">I am Linux.</TabItem> <TabItem value="linux">I am Linux.</TabItem>
</Tabs> </Tabs>
```
--- ---
@ -416,6 +424,7 @@ Tab choices with different `groupId`s will not interfere with each other:
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -437,6 +446,7 @@ Tab choices with different `groupId`s will not interfere with each other:
<TabItem value="win">Windows is windows.</TabItem> <TabItem value="win">Windows is windows.</TabItem>
<TabItem value="unix">Unix is unix.</TabItem> <TabItem value="unix">Unix is unix.</TabItem>
</Tabs> </Tabs>
```
### Customizing tabs ### Customizing tabs
@ -936,6 +946,7 @@ class HelloWorld {
And you will get the following: And you will get the following:
````mdx-code-block
<Tabs <Tabs
defaultValue="js" defaultValue="js"
values={[ values={[
@ -973,6 +984,7 @@ class HelloWorld {
</TabItem> </TabItem>
</Tabs> </Tabs>
````
You may want to implement your own `<MultiLanguageCode />` abstraction if you find the above approach too verbose. We might just implement one in future for convenience. You may want to implement your own `<MultiLanguageCode />` abstraction if you find the above approach too verbose. We might just implement one in future for convenience.
@ -1050,11 +1062,13 @@ or
[Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf) [Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf)
``` ```
```mdx-code-block
<a <a
target="_blank" target="_blank"
href={require('./assets/docusaurus-asset-example-pdf.pdf').default}> href={require('./assets/docusaurus-asset-example-pdf.pdf').default}>
Download this PDF Download this PDF
</a> </a>
```
[Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf) [Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf)

View file

@ -65,6 +65,7 @@ The headers are well-spaced so that the hierarchy is clear.
This will render in the browser as follows: This will render in the browser as follows:
```mdx-code-block
import BrowserWindow from '@site/src/components/BrowserWindow'; import BrowserWindow from '@site/src/components/BrowserWindow';
<BrowserWindow url="http://localhost:3000"> <BrowserWindow url="http://localhost:3000">
@ -90,6 +91,7 @@ The headers are well-spaced so that the hierarchy is clear.
- multiple times - multiple times
</BrowserWindow> </BrowserWindow>
```
## Markdown headers ## Markdown headers
@ -286,6 +288,7 @@ import TabItem from '@theme/TabItem';
And you will get the following: And you will get the following:
```mdx-code-block
<Tabs <Tabs
defaultValue="apple" defaultValue="apple"
values={[ values={[
@ -297,6 +300,7 @@ And you will get the following:
<TabItem value="orange">This is an orange 🍊</TabItem> <TabItem value="orange">This is an orange 🍊</TabItem>
<TabItem value="banana">This is a banana 🍌</TabItem> <TabItem value="banana">This is a banana 🍌</TabItem>
</Tabs> </Tabs>
```
:::info :::info
@ -334,6 +338,7 @@ You may want choices of the same kind of tabs to sync with each other. For examp
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -355,6 +360,7 @@ You may want choices of the same kind of tabs to sync with each other. For examp
<TabItem value="win">Use Ctrl + V to paste.</TabItem> <TabItem value="win">Use Ctrl + V to paste.</TabItem>
<TabItem value="mac">Use Command + V to paste.</TabItem> <TabItem value="mac">Use Command + V to paste.</TabItem>
</Tabs> </Tabs>
```
For all tab groups that have the same `groupId`, the possible values do not need to be the same. If one tab group with chooses an value that does not exist in another tab group with the same `groupId`, the tab group with the missing value won't change its tab. You can see that from the following example. Try to select Linux, and the above tab groups doesn't change. For all tab groups that have the same `groupId`, the possible values do not need to be the same. If one tab group with chooses an value that does not exist in another tab group with the same `groupId`, the tab group with the missing value won't change its tab. You can see that from the following example. Try to select Linux, and the above tab groups doesn't change.
@ -373,6 +379,7 @@ For all tab groups that have the same `groupId`, the possible values do not need
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -385,6 +392,7 @@ For all tab groups that have the same `groupId`, the possible values do not need
<TabItem value="mac">I am macOS.</TabItem> <TabItem value="mac">I am macOS.</TabItem>
<TabItem value="linux">I am Linux.</TabItem> <TabItem value="linux">I am Linux.</TabItem>
</Tabs> </Tabs>
```
--- ---
@ -416,6 +424,7 @@ Tab choices with different `groupId`s will not interfere with each other:
</Tabs> </Tabs>
``` ```
```mdx-code-block
<Tabs <Tabs
groupId="operating-systems" groupId="operating-systems"
defaultValue="win" defaultValue="win"
@ -437,6 +446,7 @@ Tab choices with different `groupId`s will not interfere with each other:
<TabItem value="win">Windows is windows.</TabItem> <TabItem value="win">Windows is windows.</TabItem>
<TabItem value="unix">Unix is unix.</TabItem> <TabItem value="unix">Unix is unix.</TabItem>
</Tabs> </Tabs>
```
### Customizing tabs ### Customizing tabs
@ -460,6 +470,7 @@ import TabItem from '@theme/TabItem';
</Tabs>; </Tabs>;
``` ```
```mdx-code-block
<Tabs <Tabs
className="unique-tabs" className="unique-tabs"
defaultValue="apple" defaultValue="apple"
@ -472,6 +483,7 @@ import TabItem from '@theme/TabItem';
<TabItem value="orange">This is an orange 🍊</TabItem> <TabItem value="orange">This is an orange 🍊</TabItem>
<TabItem value="banana">This is a banana 🍌</TabItem> <TabItem value="banana">This is a banana 🍌</TabItem>
</Tabs> </Tabs>
```
## Inline table of contents ## Inline table of contents
@ -489,6 +501,7 @@ import TOCInline from '@theme/TOCInline';
<TOCInline toc={toc} />; <TOCInline toc={toc} />;
``` ```
```mdx-code-block
import TOCInline from '@theme/TOCInline'; import TOCInline from '@theme/TOCInline';
<BrowserWindow> <BrowserWindow>
@ -496,6 +509,7 @@ import TOCInline from '@theme/TOCInline';
<TOCInline toc={toc} /> <TOCInline toc={toc} />
</BrowserWindow> </BrowserWindow>
```
### Custom table of contents ### Custom table of contents
@ -522,11 +536,13 @@ import TOCInline from '@theme/TOCInline';
/>; />;
``` ```
```mdx-code-block
<BrowserWindow> <BrowserWindow>
<TOCInline toc={[toc[3], toc[4]]} /> <TOCInline toc={[toc[3], toc[4]]} />
</BrowserWindow> </BrowserWindow>
```
## Callouts/admonitions ## Callouts/admonitions
@ -991,6 +1007,7 @@ class HelloWorld {
And you will get the following: And you will get the following:
````mdx-code-block
<Tabs <Tabs
defaultValue="js" defaultValue="js"
values={[ values={[
@ -1028,6 +1045,7 @@ class HelloWorld {
</TabItem> </TabItem>
</Tabs> </Tabs>
````
You may want to implement your own `<MultiLanguageCode />` abstraction if you find the above approach too verbose. We might just implement one in future for convenience. You may want to implement your own `<MultiLanguageCode />` abstraction if you find the above approach too verbose. We might just implement one in future for convenience.
@ -1105,11 +1123,13 @@ or
[Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf) [Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf)
``` ```
```mdx-code-block
<a <a
target="_blank" target="_blank"
href={require('./assets/docusaurus-asset-example-pdf.pdf').default}> href={require('./assets/docusaurus-asset-example-pdf.pdf').default}>
Download this PDF Download this PDF
</a> </a>
```
[Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf) [Download this PDF using Markdown](./assets/docusaurus-asset-example-pdf.pdf)