README.md in font_awesome5_rails-1.1.1 vs README.md in font_awesome5_rails-1.2.0
- old
+ new
@@ -1,8 +1,8 @@
# Font Awesome 5 Rails
-[![Gem Version](https://d25lcipzij17d.cloudfront.net/badge.svg?id=rb&type=6&v=1.1.0&x2=0)](https://badge.fury.io/rb/font_awesome5_rails)
-[![FA5 version](https://d25lcipzij17d.cloudfront.net/badge.svg?id=gh&type=6&v=5.13.1&x2=0)](https://github.com/tomkra/font_awesome5_rails/blob/master/lib/font_awesome5_rails/version.rb)
+[![Gem Version](https://d25lcipzij17d.cloudfront.net/badge.svg?id=rb&type=6&v=1.2.0&x2=0)](https://badge.fury.io/rb/font_awesome5_rails)
+[![FA5 version](https://d25lcipzij17d.cloudfront.net/badge.svg?id=gh&type=6&v=5.14.0&x2=0)](https://github.com/tomkra/font_awesome5_rails/blob/master/lib/font_awesome5_rails/version.rb)
[![Build Status](https://travis-ci.org/tomkra/font_awesome5_rails.svg?branch=master)](https://travis-ci.org/tomkra/font_awesome5_rails)
[![HitCount](http://hits.dwyl.io/tomkra/tomkra/font_awesome5_rails.svg)](http://hrits.dwyl.io/tomkra/tomkra/font_awesome5_rails)
**font_awesome5_rails** provides the [Font-Awesome5](https://fontawesome.com/) web fonts, stylesheets and javascripts as a Rails engine for use with the asset pipeline and with backwards compatibility with [font-awesome-rails](https://github.com/bokmann/font-awesome-rails) gem.
@@ -10,14 +10,14 @@
Keep track of changes in [Changelog](https://github.com/tomkra/font_awesome5_rails/blob/master/CHANGELOG.md).
## Table of Contents
**[Installation](#installation)** <br />
- - **[Install as webfont with CSS](#install-as-webfont-with-css)** <br />
+ - **[Install as webfont with CSS](#install-as-webfont-with-css)** <br />
- **[Install as SVG with JS](#install-as-SVG-with-JS)** <br />
- **[Install with webpack](#install-with-webpack)** <br />
-
+
**[Usage](#usage)** <br />
- **[Basic usage](#basic-usage)** <br />
- **[Solid, Regular, Light, Brand icon types](#solid-regular-light-brand-icon-types)** <br />
- **[Animations and data attributes](#animations-and-data-attributes)** <br />
- **[Layered and Stacked icons](#layered-and-stacked-icons)** <br />
@@ -41,24 +41,30 @@
In your `application.css`, include the css file:
```css
*= require font_awesome5_webfont
```
or if you prefer scss add this to your `application.css.scss` file:
-```sass
+```scss
@import 'font_awesome5_webfont';
```
### 2. Install as SVG with JS
In your `application.css`, include the css file:
```css
*= require font_awesome5
```
or if you prefer scss add this to your `application.scss` file:
-```sass
-@import 'font_awesome5.css';
+```scss
+@import 'font_awesome5.css'; //application.scss
```
+If you're using `.sass` and having problem with loading, try to omit `.css` extenstion and import font as follows:
+```scss
+@import 'font_awesome5';
+```
+Check [issue#57](https://github.com/tomkra/font_awesome5_rails/issues/57) for details.
+
In your `application.js`, include the javascript file:
```javascript
#= require font_awesome5
```
@@ -224,9 +230,15 @@
fa_stacked_icon('camera', base: 'circle', type: :fas, base_type: :fab)
# => <span class="fa-stack">
# => <i class="fab fa-circle fa-stack-2x"></i>
# => <i class="fas fa-camera fa-stack-1x"></i>
+# => </span>
+
+fa_stacked_icon('camera', base: 'circle', type: :fas, base_type: :fab, base_options: { class: 'base' }, icon_options: { style: 'color: red' })
+# => <span class="fa-stack">
+# => <i class="fab fa-circle fa-stack-2x base"></i>
+# => <i class="fas fa-camera fa-stack-1x" style="color: red"></i>
# => </span>
```
## Use as images