<commit_before># fain

React components based on [Bootstrap 4](https://v4-alpha.getbootstrap.com/) using
[CSS modules](https://github.com/css-modules/css-modules).

## Install

To use these components you need to include this module as part of your ES6 transformations.

1. `npm install fain --save`
2. Include this package as part of your ES6 transformations

```js
// webpack.config.js

module.exports = {
  // ...
  loaders: [
    {
      test: \/.jsx?$/,
      exclude: /node_modules\/(?!fain)/,
      loader: 'babel',
    },
  ],
  //...
};
```

## Example

```js
import React, { PropTypes } from 'react';

import { Button } from 'fain/components/buttons';
import { Column, Container, Row } from 'fain/components/layout';

function Root() {
  render() {
    return (
      <Container>
        <Row>
          <Column smallSize={8}>
            <Button outline primary>Sign In</Button>
          </Column>
        </Row>
      </Container>
    );
  }
}

export default Root;
```
<commit_msg>chore(readme): update readme<commit_after># fain

React components based on [ZURB Foundation Sites](http://foundation.zurb.com/sites.html) using
[CSS modules](https://github.com/css-modules/css-modules).

## Install

To use these components you need to include this module as part of your ES6 transformations.

1. `npm install fain --save`
2. Include this package as part of your ES6 transformations

```js
// webpack.config.js

module.exports = {
  // ...
  loaders: [
    {
      test: \/.jsx?$/,
      exclude: /node_modules\/(?!fain)/,
      loader: 'babel',
    },
  ],
  //...
};
```

## Example

```js
import React, { PropTypes } from 'react';

import { Button } from 'fain/controls/buttons';
import { Column, Container, Row } from 'fain/layout';

function Root() {
  render() {
    return (
      <Container>
        <Row>
          <Column smallSize={8}>
            <Button outline primary>Sign In</Button>
          </Column>
        </Row>
      </Container>
    );
  }
}

export default Root;
```

## Customize

Themability for components is available using [Foundation SASS variables](http://foundation.zurb.com/sites/docs/global.html).

{'fraction_non_alphanumeric': 0.15377446411929171, 'fraction_numerical': 0.005591798695246971, 'mean_word_length': 2.6451612903225805, 'pattern_counts': {'":': 0, '<': 19, '<?xml version=': 0, '>': 19, 'https://': 3, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4273986', 'n_tokens_mistral': 696, 'n_tokens_neox': 673, 'n_words': 189}