import './demo1.css';
import Box from '../../box';
import Checkbox from '..';
import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render((
  <>
    <Box direction="row">
      <label className="demo1-box-label">XL:</label>
      <Checkbox size="xl">Checkbox</Checkbox>
    </Box>
    <br />
    <Box direction="row">
      <label className="demo1-box-label">Large:</label>
      <Checkbox size="large">Checkbox</Checkbox>
    </Box>
    <br />
    <Box direction="row">
      <label className="demo1-box-label">Medium:</label>
      <Checkbox size="medium">Checkbox</Checkbox>
    </Box>
    <br />
    <Box direction="row">
      <label className="demo1-box-label">Small:</label>
      <Checkbox size="small">Checkbox</Checkbox>
    </Box>
  </>
), document.getElementById('checkbox-demo-1'));