import React from 'react';
import { Card } from '@digigov/ui/content/Card';
import { Grid } from '@digigov/ui/layouts/Grid';

export const Default = (_: any) => {
  return (
    <>
      <Grid role="grid" aria-label="grid-example" container spacing={4}>
        <Grid role="row" xs={12} sm={8} md={6} lg={4} xl={2}>
          <Card variant="border" role="gridcell">
            1
          </Card>
        </Grid>
        <Grid role="row" xs={12} sm={4} md={6} lg={4} xl={2}>
          <Card variant="border" role="gridcell">
            1
          </Card>
        </Grid>
        <Grid role="row" xs={12} sm={8} md={6} lg={4} xl={2}>
          <Card variant="border" role="gridcell">
            1
          </Card>
        </Grid>
        <Grid role="row" xs={12} sm={4} md={6} lg={4} xl={2}>
          <Card variant="border" role="gridcell">
            1
          </Card>
        </Grid>
        <Grid role="row" xs={12} sm={8} md={6} lg={4} xl={2}>
          <Card variant="border" role="gridcell">
            1
          </Card>
        </Grid>
        <Grid role="row" xs={12} sm={4} md={6} lg={4} xl={2}>
          <Card variant="border" role="gridcell">
            1
          </Card>
        </Grid>
      </Grid>
    </>
  );
};
export default Default;