Grid

Creates a grid layout to align components as equally sized columns.

Example

Title

KPI 1

Title

KPI 2

Title

KPI 3

Title

KPI 4

Title

KPI 5

Usage

import { Col, Grid } from "~/components/layout/grid"

<Grid cols={1} colsMd={2} class="w-full gap-2">
  <Col span={1} spanMd={2}>
    <Card>
      <CardHeader>
        <CardTitle>Title</CardTitle>
      </CardHeader>
      <CardContent>KPI 1</CardContent>
    </Card>
  </Col>
  <Card>
    <CardHeader>
      <CardTitle>Title</CardTitle>
    </CardHeader>
    <CardContent>KPI 2</CardContent>
  </Card>
  <Card>
    <CardHeader>
      <CardTitle>Title</CardTitle>
    </CardHeader>
    <CardContent>KPI 3</CardContent>
  </Card>
</Grid>