Skip to main content

CodingDocs

Codeblock​

LiveEditor​

  • Buttons

    ```jsx live
    <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
      <DyteButton>Primary button</DyteButton>
      <DyteButton variant="secondary">Secondary button</DyteButton>
      <DyteButton variant="danger">Danger button</DyteButton>
      <DyteButton variant="ghost">Ghost button</DyteButton>
    </div>
    ```

  • Playground

    ```jsx live
    function MyPlayground(props) {
        return (
            <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px' }}>
                <DyteButton variant="danger" onClick={() => alert('hey!')}>Click me</DyteButton>
            </div>
        );
    }
    ```

Terminal npm2yarn​

npm install --save @docusaurus/theme-live-codeblock 

```bash npm2yarn
npm install --save @docusaurus/theme-live-codeblock 
```