vulcan-estudios / vulcangrid

Zurb Foundation grid system for React

vulcangrid

Zurb Foundation grid system for React.

Install

$ npm install --save vulcangrid

Example

import React from 'react';
import { Row, Column } from 'vulcangrid';

function App () {
  return (
    <Row>
      <Column sm={12} md={6} lg={4}>
        <p>...</p>
      </Column>
      <Column sm={12} md={6} lg={4}>
        <p>...</p>
      </Column>
      <Column sm={12} md={6} lg={4}>
        <p>...</p>
      </Column>
    </Row>
  );
}

API

Row

The <Row /> component receives the properties:

• Boolean column - Enables the row as a combined column/row.
• Boolean expanded - Enables the row as fluid row.

It also accepts className and children.

Column

The <Column /> component receives the properties:

• Number sm - Small number of column.
• Number smOffset - Small offset number of column.
• Number md - Medium number of column.
• Number mdOffset - Medium offset number of column.
• Number lg - Large number of column.
• Number lgOffset - Large offset number of column.

It also accepts className and children.