<p align="center"><img src="https://raw.githubusercontent.com/trafilea/shapermint-components/master/images/shapermint-logo.png" width="600"></p>

<h1 align="center">
  Shapermint Components
</h1>

<div align="center">

[![License](https://img.shields.io/npm/l/@trafilea/shapermint-components.svg?style=flat-square)](/LICENSE)
[![NPM Version](https://badge.fury.io/js/%40trafilea%2Fshapermint-components.svg)](https://www.npmjs.com/@trafilea/shapermint-components)
[![Documentation](https://img.shields.io/badge/documentation-yes-brightgreen)](https://trafilea.github.io/shapermint-components)
[![Semantic Release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg?style=flat-square)](https://github.com/trafilea/shapermint-components/releases)
[![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/)

</div>

<hr>

This is the Shapermint component library | https://trafilea.github.io/shapermint-components

## Table of content

- [Installation](#installation)
- [Usage](#usage)

### Installation

Use npm to install shapermint components

`npm install @trafilea/shapermint-components @fortawesome/fontawesome-pro`

Or if you are using yarn...

`yarn add @trafilea/shapermint-components @fortawesome/fontawesome-pro`


### Usage

Import fontawesome pro sass files

```scss
@import "node_modules/@fortawesome/fontawesome-pro/scss/variables";
@import 'node_modules/@fortawesome/fontawesome-pro/scss/mixins';
@import 'node_modules/@fortawesome/fontawesome-pro/scss/core';
@import "node_modules/@fortawesome/fontawesome-pro/scss/icons";
@import "node_modules/@fortawesome/fontawesome-pro/scss/light";
@import "node_modules/@fortawesome/fontawesome-pro/scss/brands";
```

Import shapermint components styles

```scss
// -----------------------------------------------------------------------------
// Shapermint Components
// -----------------------------------------------------------------------------
@import 'node_modules/@trafilea/shapermint-components/scss/vendor/vendor';
@import 'node_modules/@trafilea/shapermint-components/scss/variables';
@import 'node_modules/@trafilea/shapermint-components/scss/helpers/mixins';
@import 'node_modules/@trafilea/shapermint-components/scss/helpers/functions';
@import 'node_modules/@trafilea/shapermint-components/scss/helpers/animations';
@import 'node_modules/@trafilea/shapermint-components/scss/atoms/buttons';
```