efureev / yii2-fontawesome
Asset Bundle for Yii2 with Font Awesome
Installs: 13
Dependents: 0
Suggesters: 0
Security: 0
Stars: 0
Watchers: 3
Forks: 49
Open Issues: 1
Type:yii2-extension
Requires
- php: >=5.4.0
- bower-asset/components-font-awesome: *
- yiisoft/yii2: ~2
- dev-master
- 2.18.0
- 2.16.1
- 2.16.0
- 2.15.2
- 2.15.1
- 2.15.0
- 2.14.0
- 2.13.0
- 2.12.2
- 2.12.1
- 2.12.0
- 2.11.0
- 2.10.3
- 2.10.2
- 2.10.1
- 2.10.0
- 2.9.2
- 2.9.1
- 2.9.0
- 2.8.2
- 2.8.1
- 2.8.0
- 2.7.1
- 2.7.0
- 2.6.2
- 2.6.1
- 2.6.0
- 2.5.0
- 2.4.2
- 2.4.1
- 2.4.0
- 2.3.0
- 2.2.2
- 2.2.1
- v2.2
- 2.1.1
- 2.1.0
- 2.0.2
- 2.0.1
- 2.0.0
- 1.2.1
- 1.2.0
- 1.1.2
- 1.1.1
- 1.1.0
- 1.0.3
- 1.0.2
- 1.0.1
- 1.0.0
- dev-preview
This package is auto-updated.
Last update: 2024-04-29 03:10:15 UTC
README
This extension provides a assets bundle with Font Awesome for Yii framework 2.0 applications and helper to use icons.
For license information check the LICENSE-file.
Code Status
Support
Installation
The preferred way to install this extension is through composer.
Either run
composer require "efureev/yii2-fontawesome:~2"
or add
"efureev/yii2-fontawesome": "~2",
to the require
section of your composer.json
file.
Usage
In view
efureev\fontawesome\AssetBundle::register($this);
or as dependency in your main application asset bundle
class AppAsset extends AssetBundle { // ... public $depends = [ // ... '\efureev\fontawesome\AssetBundle' ]; }
Class reference
Namespace: efureev\fontawesome
;
###Class FA
or FontAwesome
static FA::icon($name, $options=[])
- Creates ancomponents\Icon
that can be used to FontAwesome html icon$name
- name of icon in font awesome set.$options
- additional attributes fori.fa
html tag.
static FA::stack($name, $options=[])
- Creates ancomponents\Stack
that can be used to FontAwesome html icon$options
- additional attributes forspan.fa-stack
html tag.
###Class components\Icon
($Icon
)
(string)$Icon
- render icon$Icon->render()
- render icon$Icon->tag($value)
- set another html tag for icon (defaulti
)$value
- name of tag
$Icon->addCssClass($value)
- add to html tag css class in$value
$value
- name of css class
$Icon->inverse()
- add to html tag css classfa-inverse
$Icon->spin()
- add to html tag css classfa-spin
$Icon->fixedWidth()
- add to html tag css classfa-fw
$Icon->ul()
- add to html tag css classfa-ul
$Icon->li()
- add to html tag css classfa-li
$Icon->border()
- add to html tag css classfa-border
$Icon->pullLeft()
- add to html tag css classpull-left
$Icon->pullRight()
- add to html tag css classpull-right
$Icon->size($value)
- add to html tag css class with size$value
- size value (variants:FA::SIZE_LARGE
,FA::SIZE_2X
,FA::SIZE_3X
,FA::SIZE_4X
,FA::SIZE_5X
)
$Icon->rotate($value)
- add to html tag css class with rotate$value
- rotate value (variants:FA::ROTATE_90
,FA::ROTATE_180
,FA::ROTATE_270
)
$Icon->flip($value)
- add to html tag css class with rotate$value
- flip value (variants:FA::FLIP_HORIZONTAL
,FA::FLIP_VERTICAL
)
###Class components\Stack
($Stack
)
(string)$Stack
- render icon stack$Stack->render()
- render icon stack$Stack->tag($value)
- set another html tag for icon stack (defaultspan
)$Stack->icon($icon, $options=[])
- set icon for stack$icon
- name of icon orcomponent\Icon
object$options
- additional attributes for icon html tag.
$Stack->icon($icon, $options=[])
- set background icon for stack$icon
- name of icon orcomponent\Icon
object$options
- additional attributes for icon html tag.
Helper examples
use efureev\fontawesome\FA; // normal use echo FA::icon('home'); // <i class="fa fa-home"></i> // shortcut echo FA::i('home'); // <i class="fa fa-home"></i> // icon with additional attributes echo FA::icon( 'arrow-left', ['class' => 'big', 'data-role' => 'arrow'] ); // <i class="big fa fa-arrow-left" data-role="arrow"></i> // icon in button echo Html::submitButton( Yii::t('app', '{icon} Save', ['icon' => FA::icon('check')]) ); // <button type="submit"><i class="fa fa-check"></i> Save</button> // icon with additional methods echo FA::icon('cog')->inverse(); // <i class="fa fa-cog fa-inverse"></i> echo FA::icon('cog')->spin(); // <i class="fa fa-cog fa-spin"></i> echo FA::icon('cog')->fixedWidth(); // <i class="fa fa-cog fa-fw"></i> echo FA::icon('cog')->ul(); // <i class="fa fa-cog fa-ul"></i> echo FA::icon('cog')->li(); // <i class="fa fa-cog fa-li"></i> echo FA::icon('cog')->border(); // <i class="fa fa-cog fa-border"></i> echo FA::icon('cog')->pullLeft(); // <i class="fa fa-cog pull-left"></i> echo FA::icon('cog')->pullRight(); // <i class="fa fa-cog pull-right"></i> // icon size echo FA::icon('cog')->size(FA::SIZE_3X); // values: FA::SIZE_LARGE, FA::SIZE_2X, FA::SIZE_3X, FA::SIZE_4X, FA::SIZE_5X // <i class="fa fa-cog fa-size-3x"></i> // icon rotate echo FA::icon('cog')->rotate(FA::ROTATE_90); // values: FA::ROTATE_90, FA::ROTATE_180, FA::ROTATE_180 // <i class="fa fa-cog fa-rotate-90"></i> // icon flip echo FA::icon('cog')->flip(FA::FLIP_VERTICAL); // values: FA::FLIP_HORIZONTAL, FA::FLIP_VERTICAL // <i class="fa fa-cog fa-flip-vertical"></i> // icon with multiple methods echo FA::icon('cog') ->spin() ->fixedWidth() ->pullLeft() ->size(FA::SIZE_LARGE); // <i class="fa fa-cog fa-spin fa-fw pull-left fa-size-lg"></i> // icons stack echo FA::stack() ->icon('twitter') ->on('square-o'); // <span class="fa-stack"> // <i class="fa fa-square-o fa-stack-2x"></i> // <i class="fa fa-twitter fa-stack-1x"></i> // </span> // icons stack with additional attributes echo FA::stack(['data-role' => 'stacked-icon']) ->on(FA::Icon('square')->inverse()) ->icon(FA::Icon('cog')->spin()); // <span class="fa-stack" data-role="stacked-icon"> // <i class="fa fa-square-o fa-inverse fa-stack-2x"></i> // <i class="fa fa-cog fa-spin fa-stack-1x"></i> // </span> // unordered list icons echo FA::ul(['data-role' => 'unordered-list']) ->item('circle', 'Bullet item') ->item('check', 'Checked item'); // <ul class="fa-ul" data-role="unordered-list"> // <li><i class="fa fa-circle fa-li"></i>Bullet item</li> // <li><i class="fa fa-check fa-li"></i>Checked Item</li> // </span> // autocomplete icons name in IDE echo FA::icon(FA::_COG); echo FA::icon(FA::_DESKTOP); echo FA::stack() ->on(FA::_CIRCLE_O) ->icon(FA::_TWITTER);
Set another prefix
FA::$cssPrefix = 'awf'; echo FA::icon('home'); // <i class="awf awf-home"></i> echo FA::icon('cog')->inverse(); // <i class="awf awf-cog awf-inverse"></i>