React

npm install --save gel-bootstrap-3

npm install --save react-bootstrap

npm install --save react-nouislider

To build a specific theme within a project (with Webpack, for example) include the main less source file:

This will build with the light gray GEL theme:

@import "~gel-bootstrap-3/src/lib/css/gray-light-gel.css";

Along with the theme-specific variables:

@import "~gel-bootstrap-3/src/less/themes/gray/light/variables.less";

Core Bootstrap Components

For core Bootstrap components, simply use the react-bootstrap implementation.

<Button>Button</Button>

Bootstrap Component Variations

For GEL variations on core Bootstrap components, the bsClass property of the react-bootstrap component will be needed.

<Button bsClass="btn btn-raised">Button</Button>

Custom GEL Components

For custom non-Bootstrap components, use the HTML markup found on that component's GEL page.

<span className="chip">
    <span className="chip-avatar"><i className="fa fa-rocket"></i></span>
    Example Chip
    <button className="remove">&times;</button>
</span>