Package Exports

styled-css-grid

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (styled-css-grid) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

`styled-css-grid`

A lightweight CSS grid layout for React, built with styled-components 💅.

demo

See the website.

installation

Install React and styled-components, then:

$ yarn add styled-css-grid

usage

import React from "react";
import { Grid, Cell } from "styled-css-grid";

const MyGrid = () => (
  <Grid columns={2} gap="2px">
    <Cell>foo</Cell>
    <Cell height={2}>bar</Cell>
    <Cell width={2}>baz</Cell>
  </Grid>
);

api

`Cell`

A cell. Not too much to say...

Props:

width: Cell width in units, default is 1.
height: Cell height in units, default is 1.

`Grid`

Wrap your cells in Grid. Pretty simple.

Props:

columns: Number of columns to draw, default is 3.
gap: Gap between cells. Default is "8px".
minRowHeight: Minimum height of each row. Default is "20vh".