Angular directive for FontAwesome
npm install angular-fontawesome
http://picardy.github.io/angular-fontawesome/demo/
A simple directive for FontAwesome icons. Avoid writing a massive ngStyle declaration for your FontAwesome integration, and use the power of Angular to make interactive icon-based widgets.
1. Include the FontAwesome CSS and fonts in your application by following their instructions.
2. Include the angular-fontawesome module in your Angular app.
``javascript`
angular.module('myApp', ['picardy.fontawesome'])
3. Use the directive on any page which bootstraps your app.
`html`
The fa directive's attributes map to the classes used by FontAwesome\.
`html`
size="1-5|large"
flip="horizontal|vertical"
rotate="90|180|270"
spin
border
list
>
##### name
The icon's name, such as fa-spinner or fa-square.`html`
##### alt
For accessibility support, you can now add an alt attribute, which will add a screen-reader friendly replacement text.
`html`
github website
notice: the 'sr-only' class will hide the text from anyone not using a screen reader. It is derived from Bootstrap, so if you're not using Bootstrap, you must add this style to your css:
`css`
.sr-only {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
border: 0;
}
##### size
The icon's font size, either defined by a multiplier (1-5), or by the string "large".`html`
##### flip
Flip the icon horizontal or vertical.`html`
##### rotate
Rotate the icon 90, 180, or 270 degrees.`html`
##### spin
Animate the icon to spin. You don't need to provide true to use the boolean attributes:
`html`true
You can pass in or false to the attribute as well, allowing the spin class to be be easily toggleable.`html`
##### border
`html`
##### fixed width
`html`
##### inverse
`html`
##### list
This directive autodetects if you're setup to do fa-li and then takes care of it for you.`html`
Text here
Text here
##### stack
The faStack directive is used as a wrapper for stacked fonts used by FontAwesome\.
`html`
When using
as described here.
Failure to do so will render the fonts, just not one on top of another like we want them to.
tests
* pull="left", pull="right"`