@ds-kit/grid

Grid component

Stats

StarsIssuesVersionUpdatedCreatedSize
@ds-kit/grid
5.2.02 years ago3 years agoMinified + gzip package size for @ds-kit/grid in KB

Readme


title: "Grid" slug: "/packages/grid" category: "layout" componentNames:

  • "Grid"
  • "GridItem"

Grid

The Grid package contains a useful set of components relevant for layout work. It has helper components to create flex, as well as css-grid layouts.

import { Grid, GridItem } from "@ds-kit/grid"

Simple Example

The simplest example of a grid (using css grid) will look like this:

<Grid>
  <GridItem gridColumn="span 4" bg="grey.25">
    {"Column 1"}
  </GridItem>
  <GridItem gridColumn="span 4" bg="grey.25">
    {"Column 2"}
  </GridItem>
  <GridItem gridColumn="span 4" bg="grey.25">
    {"Column 3"}
  </GridItem>
</Grid>

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.