Font Awesome The iconic font and CSS toolkit

Administrator

Join date : 2012-12-09

Posts : 486

Thanks gained - : 3758

Gender :

Age : 30

Location : India kerala

Posted Wed May 17, 2017 10:41 pm

POPULAR

Font Awesome gives you scalable vector icons that can instantly be customized — size, color, drop shadow, and anything that can be done with the power of CSS.

One Font, 675 Icons

In a single collection, Font Awesome is a pictographic language of web-related actions.

No JavaScript Required

Fewer compatibility concerns because Font Awesome doesn't require JavaScript.

Infinite Scalability

Scalable vector graphics means every icon looks awesome at any size.

Free, as in Speech

Font Awesome is completely free for commercial use. Check out the license.

CSS Control

Easily style icon color, size, shadow, and anything that's possible with CSS.

Perfect on Retina Displays

Font Awesome icons are vectors, which mean they're gorgeous on high-resolution displays.

Plays Well with Others

Originally designed for Bootstrap, Font Awesome works great with all frameworks.

Desktop Friendly

To use on the desktop or for a complete set of vectors, check out the cheatsheet.

Accessibility-minded

Font Awesome loves screen readers and helps make your icons accessible on the web.

visit http://fontawesome.io/

How To use fontawesome icons in NimbuzzMasters

Font Awesome The iconic font and CSS toolkit Snapshot_5_

Click The  icon

Font Awesome The iconic font and CSS toolkit Snapshot_6_

To select icons Font Awesome The iconic font and CSS toolkit 1f605

Font Awesome The iconic font and CSS toolkit 1f607

 

Supper mod

Join date : 2012-12-16

Posts : 114

Thanks gained - : 681

Gender :

Age : 37

Location : India

Posted Thu May 18, 2017 6:33 am

Nice @AYSHA
You

Management team

Join date : 2012-12-16

Posts : 307

Thanks gained - : 1588

Gender :

Age : 38

Location : Pakisthan

Posted Thu May 18, 2017 7:55 pm

It's Too Informative @AYSHA

:u3:

:u18:

Designer

Join date : 2012-12-16

Posts : 148

Thanks gained - : 3794

Gender :

Age : 28

Posted Sun May 28, 2017 7:26 am

Great. @AYSHA

You

:u19:

Member

Join date : 2013-01-06

Posts : 21

Thanks gained - : 49

Gender :

Posted Tue May 30, 2017 9:16 am

POPULAR

awesome

how to install this one in my forums

Administrator

Join date : 2012-12-09

Posts : 486

Thanks gained - : 3758

Gender :

Age : 30

Location : India kerala

Posted Tue May 30, 2017 10:24 am

@Ben gyarin

css

Code:: /* Add fontawesome to textarea font-family so the icons are visible */ .sceditor-container textarea { font-family:Verdana, Arial, Helvetica, sans-serif, FontAwesome !important } /* button image */ .sceditor-button-fontawesome div { background:url(http://i19.servimg.com/u/f19/19/06/98/92/fa-f10.png) !important } /* drop down */ .sceditor-fontawesome { width:220px; height:250px; overflow-y:auto; } /* icons */ .sceditor-fontawesome i { color:#333; font-size:20px; text-align:center; cursor:pointer; padding:3px 0; width:25%; } .sceditor-fontawesome i:hover { color:#666 }

JavaScript

Title : SCEditor Font Awesome Icons
Placement : In all the pages

Code:: $(function(){ if (!$.sceditor) return; var defaultSize = 18, // default icon size autoClose = 1, // closes drop down after an icon is clicked, if enabled // icon list fa = ['','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','','',''], A = '', O = A; // if the size is above 0 we'll format a default size for the icons if (defaultSize) { A += '[size=' + defaultSize + ']'; O += '[/size]'; } // create sceditor button and drop down $.sceditor.command.set('fontawesome', { dropDown : function(editor, caller, callback) { var a, b = '', c = document.createElement('DIV'), i = 0, j = fa.length; for (; i<j; i++) b += '<i class="fa">' + fa[i] + '</i>'; c.innerHTML = b; for (a = c.getElementsByTagName('I'), i = 0, j = a.length; i<j; i++) { a[i].onclick = function() { callback(this.innerHTML); autoClose && editor.closeDropDown(true); }; } editor.createDropDown(caller, 'fontawesome', c); }, // wysiwyg exec : function(c) { var e = this; $.sceditor.command.get('fontawesome').dropDown(e, c, function(icon) { e.insert(' [font=FontAwesome]' + A + icon + O + '[/font] ', '', true, true, true); }); }, // source txtExec : function(c) { var e = this; $.sceditor.command.get('fontawesome').dropDown(e, c, function(icon) { e.insert(' [font=FontAwesome]' + A + icon + O + '[/font] ', ''); }); }, tooltip : 'Font Awesome Icons' }); toolbar = toolbar.replace(/date,/,'fontawesome,date,'); // add the button to the toolbar });

Posted