NeoNexusIoniconsBundle
About
This Bundle makes it easy to integrate Ionicons into your Symfony2 projects.
Prerequisites
- Ionicons repo installed somewhere in your project. It is not contained in this bundle. You can use Composer, Bower or any other way to install it.
Installation
-
Add
neonexus/ionicons-bundle
to yourcomposer.json
:{ ... "require": { ... "neonexus/ionicons-bundle": "0.4.*", "driftyco/ionicons": "1.5.*" } ... }
-
Add
IoniconsBundle
to yourAppKernel.php
:... public function registerBundles() { $bundles = array( ... new NeoNexus\Ionicons\IoniconsBundle() ); ... } ...
-
Update your dependencies:
composer update
.
NOTICE Installing Ionicons via composer is optional but makes this bundle work out of the box. So I recommend this way.
Configuration
If you did not install Ionicons via composer you have to configure the path to your installation:
ionicons:
assets_dir: %kernel.root_dir%/../vendor/driftyco/ionicons
Customization
If you want to customize Ionicons you have to put a customized variables file somewhere in your project and configure the path. You also have to set the output path.
ionicons:
filter: less
customize:
variables_file: %kernel.root_dir%/Resources/ionicons/variables.less
ionicons_output: %kernel.root_dir%/Resources/less/ionicons.less
If you want to use the lessphp
or sass
Assetic filter you have to set the filter
variable accordingly.
There is a command to generate a customized output file to incorporate your customized variables file:
app/console neonexus:ionicons:generate
Usage
Installation of font files
The bundle provides a command to install the font files to the web/fonts
directory:
app/console neonexus:ionicons:install
There is also a ScriptHandler
for conveniently doing this automatically on each composer install
or composer update
:
...
"scripts": {
"post-install-cmd": [
...
"NeoNexus\\Ionicons\\Composer\\ScriptHandler::install"
],
"post-update-cmd": [
...
"NeoNexus\\Ionicons\\Composer\\ScriptHandler::install"
]
},
...
To include the Ionicons css just include @ionicons_css
in your base template.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>{% block title %}Welcome!{% endblock %}</title>
{% block stylesheets %}
{% stylesheets
'@ionicons_css'
%}
<link rel="stylesheet" href="{{ asset_url }}" media="screen"/>
{% endstylesheets %}
{% endblock %}
Simple icons (currently broken)
To insert a simple icon add {{ fa_icon( icon name|options ) }}
into your template.
The parameter can be a string
containing only the icon name without fa-
prefix
or JSON
for more customization. The complete set of options is as follows:
{
icon: name of the icon without 'fa-' prefix
scale: [lg|2x|3x|4x|5x|stack-1x|stack-2x],
fixed-width: [true|false],
list-icon: [true|false],
border: [true|false],
pull: [left|right],
spin: [true|false],
rotate: [90|180|270],
flip: [horizontal|vertical],
inverse: [true|false]
}
TODO
- Fix the Twig Extension
- Fix the tests
License
- This bundle is licensed under the MIT License.
- Ionicons is also licensed under the MIT License.
Acknowledgment
- This bundle is forked from, and inspired by the Font Awesome Bundle. Thanks Andreas Ernst!