1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import { CodeBlock, RenderedHTML } from 'mdxts/components'
export function Basic() {
return (
<div style={{ display: 'grid', gap: '2rem' }}>
<div style={{ display: 'grid', gap: '1rem' }}>
<h2>Input</h2>
<CodeBlock
language="jsx"
value="<h1 style={{ fontSize: '6rem' }}>Hello World</h1>"
/>
</div>
<div style={{ display: 'grid', gap: '1rem' }}>
<h2>Output</h2>
<RenderedHTML includeHtml={false}>
<h1 style={{ fontSize: '6rem' }}>Hello World</h1>
</RenderedHTML>
</div>
</div>
)
}
Input
<h1 style={{ fontSize: '6rem' }}>Hello World</h1>
Output
<h1 style="font-size:6rem">Hello World</h1>