{% if page.title %}{{ page.title }}{% endif %}

- After you get up and running, you can place Font Awesome icons just about - anywhere with the <i> tag. - Many examples appreciatively re-used from the Bootstrap documentation. -

- +

- Use icon-border and pull-right or pull-left for easy pull quotes or - article graphics. + + …tomorrow we will run faster, stretch out our arms farther… And then one fine morning— + So we beat on, boats against the current, borne back ceaselessly into the past.

- - Use a few of the new styles together, and you've got easy pull quotes or a great introductory article image. - Or spinning icons for loading and refreshing content. Or fun big icons in multi-line buttons. You can combine all - of them in any combination to get lots of new possibilities. -

-{% highlight html %} - -Use a few of the new styles together ... lots of new possibilities. -{% endhighlight %} -

+ Use fa-border and fa-pull-right or fa-pull-left for easy pull quotes or + article icons. +

{% highlight html %} - -Use a few of the new styles together ... lots of new possibilities. + +...tomorrow we will run faster, stretch out our arms farther... +And then one fine morning— So we beat on, boats against the +current, borne back ceaselessly into the past. {% endhighlight %}

diff --git a/library/font_awesome/src/_includes/examples/bulleted-lists.html b/library/font_awesome/src/_includes/examples/bulleted-lists.html deleted file mode 100644 index 73db34e47..000000000 --- a/library/font_awesome/src/_includes/examples/bulleted-lists.html +++ /dev/null @@ -1,31 +0,0 @@ -

- -

Bulleted lists (like this one)
Buttons
Button groups
Navigation
Prepended form inputs
…and many more with custom CSS

Easily replace individual bullets.

-{% highlight html %} -

Bulleted lists (like this one)
Buttons
Button groups
Navigation
Prepended form inputs
…and many more with custom CSS

-{% endhighlight %} -

Make sure to NOT include any whitespace after the icon declaration.

diff --git a/library/font_awesome/src/_includes/examples/button-dropdowns.html b/library/font_awesome/src/_includes/examples/button-dropdowns.html deleted file mode 100644 index 201eb1cd4..000000000 --- a/library/font_awesome/src/_includes/examples/button-dropdowns.html +++ /dev/null @@ -1,36 +0,0 @@ -

- -

- User - - -

-{% highlight html %} -

- User - - -

-{% endhighlight %} -

Don't forget to add the appropriate JavaScript to enable button dropdowns.

diff --git a/library/font_awesome/src/_includes/examples/button-groups.html b/library/font_awesome/src/_includes/examples/button-groups.html deleted file mode 100644 index ce4892309..000000000 --- a/library/font_awesome/src/_includes/examples/button-groups.html +++ /dev/null @@ -1,25 +0,0 @@ -

- -

- - - - -

-{% highlight html %} -

- - - - -

-{% endhighlight %} -

diff --git a/library/font_awesome/src/_includes/examples/buttons.html b/library/font_awesome/src/_includes/examples/buttons.html deleted file mode 100644 index b8d147c07..000000000 --- a/library/font_awesome/src/_includes/examples/buttons.html +++ /dev/null @@ -1,57 +0,0 @@ -

- -

- - Reload - - Checkout -

- - Comment - - Info -

- - Delete - - Settings -

- - Font Awesome
Version {{ site.fontawesome.version }} -

- - Synchronizing Content... -

- Font Awesome icons work great in buttons. You can even combine them with larger icon styles, - pull-right and pull-left, and icon-spin. -

-{% highlight html %} - - Reload - - Checkout - - Comment - - Info - - Delete - - Settings - - Font Awesome
Version {{ site.fontawesome.version }} - - Synchronizing Content... -{% endhighlight %} -

diff --git a/library/font_awesome/src/_includes/examples/custom.html b/library/font_awesome/src/_includes/examples/custom.html index dfad1900c..2de7ad7ab 100644 --- a/library/font_awesome/src/_includes/examples/custom.html +++ b/library/font_awesome/src/_includes/examples/custom.html @@ -1,10 +1,10 @@

Anything you can do with CSS font styles, you can do with Font Awesome.

Star Ratings (inspired by CSS Tricks)

diff --git a/library/font_awesome/src/_includes/examples/fixed-width.html b/library/font_awesome/src/_includes/examples/fixed-width.html new file mode 100644 index 000000000..845a79609 --- /dev/null +++ b/library/font_awesome/src/_includes/examples/fixed-width.html @@ -0,0 +1,33 @@ +

+ +

+ Home + Library + Applications + Settings +

+ Use fa-fw to set icons at a fixed width. Great to use when different icon widths throw off alignment. + Especially useful in things like nav lists & list groups. +

+{% highlight html %} +

+ Home + Library + Applications + Settings +

+{% endhighlight %} +

diff --git a/library/font_awesome/src/_includes/examples/form-inputs.html b/library/font_awesome/src/_includes/examples/form-inputs.html deleted file mode 100644 index dcb39a8f2..000000000 --- a/library/font_awesome/src/_includes/examples/form-inputs.html +++ /dev/null @@ -1,31 +0,0 @@ -

- -

-{% highlight html %} - -{% endhighlight %} -

diff --git a/library/font_awesome/src/_includes/examples/inline-icons.html b/library/font_awesome/src/_includes/examples/inline-icons.html deleted file mode 100644 index 3965e7c2a..000000000 --- a/library/font_awesome/src/_includes/examples/inline-icons.html +++ /dev/null @@ -1,19 +0,0 @@ -

- -

Place Font Awesome icons just about anywhere with the <i> tag.

- icon-camera-retro -

-{% highlight html %} - icon-camera-retro -{% endhighlight %} -

Icon classes are echoed via CSS :before.

diff --git a/library/font_awesome/src/_includes/examples/larger-icons.html b/library/font_awesome/src/_includes/examples/larger-icons.html deleted file mode 100644 index 95f1ee13b..000000000 --- a/library/font_awesome/src/_includes/examples/larger-icons.html +++ /dev/null @@ -1,35 +0,0 @@ -

- -

- To increase the size of icons relative to its container, use icon-large, icon-2x, - icon-3x, or icon-4x. -

- Increase the icon size by using the icon-large (33% increase), icon-2x, - icon-3x, or icon-4x classes. -

icon-camera-retro

-{% highlight html %} -

icon-camera-retro

-{% endhighlight %} -

- If your icons are getting chopped off on top and bottom, make sure you have - sufficient line-height. -

diff --git a/library/font_awesome/src/_includes/examples/larger.html b/library/font_awesome/src/_includes/examples/larger.html new file mode 100644 index 000000000..f10c7188a --- /dev/null +++ b/library/font_awesome/src/_includes/examples/larger.html @@ -0,0 +1,40 @@ +

+ +

fa-lg

fa-2x

fa-3x

fa-4x

fa-5x

+ To increase icon sizes relative to their container, use the fa-lg (33% increase), fa-2x, + fa-3x, fa-4x, or fa-5x classes. +

+{% highlight html %} + fa-lg + fa-2x + fa-3x + fa-4x + fa-5x +{% endhighlight %} +

+ + If your icons are getting chopped off on top and bottom, make sure you have + sufficient line-height. +

diff --git a/library/font_awesome/src/_includes/examples/list.html b/library/font_awesome/src/_includes/examples/list.html new file mode 100644 index 000000000..a708902be --- /dev/null +++ b/library/font_awesome/src/_includes/examples/list.html @@ -0,0 +1,30 @@ +

+ +

List icons
can be used
as bullets
in lists

Use fa-ul and fa-li to easily replace default bullets in unordered lists.

+{% highlight html %} +

List icons
can be used
as bullets
in lists

+{% endhighlight %} +

diff --git a/library/font_awesome/src/_includes/examples/navigation.html b/library/font_awesome/src/_includes/examples/navigation.html deleted file mode 100644 index 850e64442..000000000 --- a/library/font_awesome/src/_includes/examples/navigation.html +++ /dev/null @@ -1,26 +0,0 @@ - diff --git a/library/font_awesome/src/_includes/examples/new.html b/library/font_awesome/src/_includes/examples/new.html deleted file mode 100644 index 8393f7d36..000000000 --- a/library/font_awesome/src/_includes/examples/new.html +++ /dev/null @@ -1,47 +0,0 @@ -<{% if page.navbar_active == "examples" %}div{% else %}section{% endif %} id="new-styles"> - -

Rotated and Flipped Icons

- normal
- icon-rotate-90
- icon-rotate-180
- icon-rotate-270
- icon-flip-horizontal
- icon-flip-vertical -

Stacked Icons

- - - - - icon-twitter on icon-check-empty
- - - - - icon-flag on icon-circle
- - - - - icon-terminal on icon-sign-blank -

Better Bulleted Lists

New bulleted lists
Fix some old bugs
And deal with arbitrary
Font sizes better

- diff --git a/library/font_awesome/src/_includes/examples/rotated-flipped.html b/library/font_awesome/src/_includes/examples/rotated-flipped.html index cf061cd59..4c5b437f1 100644 --- a/library/font_awesome/src/_includes/examples/rotated-flipped.html +++ b/library/font_awesome/src/_includes/examples/rotated-flipped.html @@ -1,29 +1,34 @@

- +

- A set of classes that can be used to arbitrarily rotate and flip icons. +

+ normal
+ fa-rotate-90
+ fa-rotate-180
+ fa-rotate-270
+ fa-flip-horizontal
+ fa-flip-vertical +

- normal
- icon-rotate-90
- icon-rotate-180
- icon-rotate-270
- icon-flip-horizontal
- icon-flip-vertical -

+ To arbitrarily rotate and flip icons, use the fa-rotate-* and fa-flip-* classes. +

{% highlight html %} - normal
- icon-rotate-90
- icon-rotate-180
- icon-rotate-270
- icon-flip-horizontal
- icon-flip-vertical + normal
+ fa-rotate-90
+ fa-rotate-180
+ fa-rotate-270
+ fa-flip-horizontal
+ fa-flip-vertical {% endhighlight %} -

- Rotating and flipping icons aren't yet supported in IE7. -

diff --git a/library/font_awesome/src/_includes/examples/stacked.html b/library/font_awesome/src/_includes/examples/stacked.html index 3e7240c12..505ed2edf 100644 --- a/library/font_awesome/src/_includes/examples/stacked.html +++ b/library/font_awesome/src/_includes/examples/stacked.html @@ -1,54 +1,64 @@

- -

- A method for easily stacking multiple icons. Use the icon-stack class on the parent and - icon-stack-base for the bottom icon. + +

+ - icon-twitter on icon-check-empty
- - - + fa-twitter on fa-square-o
+ - icon-flag on icon-circle
- - - + fa-flag on fa-circle
+ - icon-terminal on icon-sign-blank
- - - + fa-terminal on fa-square
+ - icon-camera on icon-ban-circle + fa-ban on fa-camera

+ To stack multiple icons, use the fa-stack class on the parent, the fa-stack-1x + for the regularly sized icon, and fa-stack-2x for the larger icon. fa-inverse + can be used as an alternative icon color. You can even throw larger icon classes on the parent + to get further control of sizing. +

{% highlight html %} - - - + + + -icon-twitter on icon-check-empty
- - - +fa-twitter on fa-square-o
+ + + -icon-flag on icon-circle
- - - +fa-flag on fa-circle
+ + + -icon-terminal on icon-sign-blank
- - - +fa-terminal on fa-square
+ + + -icon-camera on icon-ban-circle +fa-ban on fa-camera {% endhighlight %}

diff --git a/library/font_awesome/src/_includes/footer.html b/library/font_awesome/src/_includes/footer.html index 186b1524d..e299adf2e 100644 --- a/library/font_awesome/src/_includes/footer.html +++ b/library/font_awesome/src/_includes/footer.html @@ -1,23 +1,41 @@ -

{{$field.field_name}}	{{$field.field_desc}}	{{$drop}}
{{$field.field_name}}	{{$field.field_desc}}	{{$drop}}

{{$check.title}}		{{if $check.required}}(required){{/if}}
{{$check.title}}		{{if $check.required}}(required){{/if}}
{{$check.help}}
{{if $edit}} - + {{/if}}	{{if $item.bb_element}} - + {{/if}}	{{if $edit}} - + {{/if}}	diff --git a/view/tpl/like_noshare.tpl b/view/tpl/like_noshare.tpl index 3ce7eb497..67f5868cb 100755 --- a/view/tpl/like_noshare.tpl +++ b/view/tpl/like_noshare.tpl @@ -1,5 +1,5 @@ - - + + diff --git a/view/tpl/locmanage.tpl b/view/tpl/locmanage.tpl index 89d5295ad..a450c2847 100644 --- a/view/tpl/locmanage.tpl +++ b/view/tpl/locmanage.tpl @@ -8,7 +8,7 @@ $.post(baseurl + '/locs','drop='+id,function(data) { window.location.href=window.location.href; }); } - + {{$header}} @@ -31,8 +31,8 @@
{{$hub.hubloc_addr}}	{{$hub.hubloc_url}}	{{if $hub.primary}}{{else}}{{/if}}		{{if $hub.primary}}{{else}}{{/if}}
{{if $m.bookmark}}{{/if}}	{{if $m.bookmark}}{{/if}}	{{$m.menu_name}}	{{$m.menu_desc}}			{{$m.menu_created}}	{{$m.menu_edited}}
{{$m.mitem_desc}}	{{$m.mitem_link}}	{{if $m.allow_cid \|\| $m.allow_gid \|\| $m.deny_cid \|\| $m.deny_gid}} {{/if}}			{{if $m.allow_cid \|\| $m.allow_gid \|\| $m.deny_cid \|\| $m.deny_gid}} {{/if}}

Warning!

Every Font Awesome {{ site.fontawesome.version }} Icon, CSS Class, & Unicode

Project Milestones

Submitting Pull Requests

+ Accessibility-Minded +

Animated Spinner

+ Animated Icons + + View LESS + View SASS + +

+ Basic Icons + + View LESS + View SASS + +

Bootstrap 3 Examples

Bordered & Pulled Icons

+ Bordered & Pulled Icons + + View LESS + View SASS + +

Bulleted Lists

Button Dropdowns

Button Groups

Buttons

Custom CSS

+ Fixed Width Icons + + View LESS + View SASS + +

Prepended & Appended Form Inputs

Inline Icons

Larger Icons

+ Larger Icons + + View LESS + View SASS + +

+ List Icons + + View LESS + View SASS + +

Navigation

New Styles in {{ site.fontawesome.minor_version }}

Rotated & Flipped

+ Rotated & Flipped + + View LESS + View SASS + +

Stacked Icons

+ Stacked Icons + + View LESS + View SASS - - - - - +

Transportation Icons

Video Player Icons

Web Application Icons

Font Awesome

Font Awesome

{{ jumbotron_h1 }}

{{ jumbotron_h1 }}

Font License

Code License

Documentation License

Brand Icons

Completely Rewritten

CSS Best Practices

New Icon Names

Bootstrap 3

Better Compatibility

{{ icons | version:site.fontawesome.minor_version | size }} New Icons in {{ site.fontawesome.minor_version }}

New Naming Conventions in {{ site.fontawesome.minor_version }}

fa-*

*-o

*-circle

*-square

*-right, *-up, etc.

*-alt

*-h, *-v

Combine 'em up&helip;

Upgrading from 3.2.1?

Camera Retro Tee

$28

Classics Tee

$28

Have Ideas or Requests?

Fa-ther Tee

$28

Green Logo Tee

$28

Old Skool Tee

$28

Rock Paper Scissors Lizard Spock Tee

$28

Space Shuttle Tee

$28

White Logo Tee

$28

Thanks To

{{ icons | version:site.fontawesome.minor_version | size }} New Icons in {{ site.fontawesome.minor_version }}

SCSS Support

Pixel Perfection at 14px

Want More Details?

One Font, {{ icons | size }} Icons

One Font, {{ icons | size }} Icons

CSS Control

+ Animated Icons +
+ View LESS + View SASS +
+

+ Basic Icons +
+ View LESS + View SASS +
+

+ Bordered & Pulled Icons +
+ View LESS + View SASS +
+

+ Fixed Width Icons +
+ View LESS + View SASS +
+

+ Larger Icons +
+ View LESS + View SASS +
+

+ List Icons +
+ View LESS + View SASS +
+

+ Rotated & Flipped +
+ View LESS + View SASS +
+

+ Stacked Icons +
+ View LESS + View SASS
-
-
- - - +

-right, -up, etc.

-h, -v