Carlos deArtola monogramCARLOS DE ARTOLA
APPENDIX D

Code Block

Canvas inside a hairline, mono type, a COPY control. No syntax colouring.

HANDLE
code-block
LIVES IN
src/components/CodeBlock.jsx
USED ON
System pages, beside every example
PROPS
code · lang · label
EXAMPLE
LIVE

As it renders.

JSX
<Plate className="p-8">
  <p className="display-italic">Paper, a hairline, four brackets.</p>
</Plate>
CODE
COPY AND PASTE

How it is called.

JSX
import CodeBlock from '../components/CodeBlock.jsx'

<CodeBlock lang="JSX" code={`<Plate className="p-8">…</Plate>`} />
RULES

What must stay true.

Canvas inside a hairline, mono type, a COPY control. No syntax colouring.