From 9ce6d646ff718cd62f6434c9a4c94e450436612a Mon Sep 17 00:00:00 2001 From: Thomas Backlund Date: Sun, 12 Oct 2014 12:27:45 +0300 Subject: Revert "Updated Estonian translation" This reverts commit a0b2d09125d7911656fe4cb286f20643c4432281. --- g/fa/docs/index.html | 844 +++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 844 insertions(+) create mode 100755 g/fa/docs/index.html (limited to 'g/fa/docs/index.html') diff --git a/g/fa/docs/index.html b/g/fa/docs/index.html new file mode 100755 index 000000000..409592bc1 --- /dev/null +++ b/g/fa/docs/index.html @@ -0,0 +1,844 @@ + + + + + + + + + Font Awesome, the iconic font designed for use with Twitter Bootstrap + + + + + + + + + + + + + + + +
+ +
+
+
+

Font Awesome

+ + +
+
+
+ +
+
+ +
+

Font Awesome

+

The iconic font designed for use with Twitter Bootstrap

+
+ Download
Font Awesome + View Project
on GitHub +
+
+
+ +
+
+
+

One font, 150+ icons

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

Free for commercial use

+ The Font Awesome webfont and CSS libraries are completely free for commercial use. +
+
+

Screen reader compatible

+ Font Awesome won't trip up screen readers, unlike most icon fonts. +
+
+
+
+

Infinite scalability

+ Scalable vector graphics means icons look awesome at any size. +
+
+

CSS control

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

Broad compatibility

+ Wide @font-face support means Font Awesome works in modern browsers . +
+
+
+
+

Made for Twitter Bootstrap

+ Designed from scratch to be fully backwards compatible with Twitter Bootstrap 2.0. +
+
+

Growing set of icons

+ Ever expanding to support a wider array of web-related actions. +
+
+

Follow on Twitter

+ Follow @fortaweso_me on Twitter for icon updates and styling tricks. +
+
+
+ +
+
+

Base Icons

+

Inspired by the Glyphicon set that comes with Twitter Bootstrap 2.0, Font Awesome is designed from scratch for a full array of web-related actions.

+
+
+
    +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • + +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
+
+ +
+
    +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • + +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
+
+ +
+
    +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • + +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
+
+ +
+
    +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • + +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
  • +
+
+
+ +
+
+

Extended Icons

+

+ But wait, there's more! Font Awesome also includes this set of ever-expanding extra-awesome pictograms. +

+
+
+
    +
  • +
  • +
  • +
  • +
  • +
+
+
+
    +
  • +
  • +
  • +
  • +
  • +
+
+
+
    +
  • +
  • +
  • +
  • +
  • +
+
+
+
    + +
  • +
  • +
  • +
  • +
+
+
+ +
+

Examples

+

Many examples re-used from the Twitter Bootstrap documentation.

+
+
+
+

Use Font Awesome icons in:

+
    +
  • Bulleted lists (like this one)
    • +
  • Buttons
    • +
  • Button groups
    • +
  • Navigation
    • +
  • Prepended form inputs
    • +
  • And many more with Custom CSS
    • +
+
+
+
+

+ Refresh + Checkout + Delete +

+

+ Comment + Settings + More Info +

+
+ +
+
+
+
+
+ + + + +
+
+ User + + +
+
+
+
+
+
+ + +
+
+
+
+
+
+ + +
+
+
+
+
+ + + +
+
+
+
+ +
+

Integration

+

It's easy to integrate Font Awesome into Twitter Bootstrap, or even use it on its own.

+
+
+

Bootstrap using LESS

+

Use this method if integrating with Twitter Bootstrap using LESS

+
+
+
    +
  1. Copy the Font Awesome font directory into your project.
    2. +
  2. Copy font-awesome.less into your bootstrap/less directory.
    3. +
  3. Open bootstrap.less and replace @import "sprites.less"; with @import "font-awesome.less";
    4. +
  4. + Open your project's font-awesome.less and edit the font url to ensure it points to the right place. +
    +@font-face {
+  font-family: 'FontAwesome';
+  src: url('../font/fontawesome-webfont.eot');
+  src: url('../font/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
+     url('../font/fontawesome-webfont.woff') format('woff'),
+     url('../font/fontawesome-webfont.ttf') format('truetype'),
+     url('../font/fontawesome-webfont.svgz#FontAwesomeRegular') format('svg'),
+     url('../font/fontawesome-webfont.svg#FontAwesomeRegular') format('svg');
+  font-weight: normal;
+  font-style: normal;
+}
+
    +
    5. +
  5. Re-compile your LESS if using a static compiler. Otherwise, you should be good to go.
    6. +
  6. Check out the examples to start using Font Awesome!
    7. +
+
+
+
+
+

Bootstrap using CSS

+

Use this method if integrating with Twitter Bootstrap using CSS.

+
+
+
    +
  1. Copy the Font Awesome font directory into your project.
    2. +
  2. Copy font-awesome.css into your project.
    3. +
  3. Open your project's font-awesome.css and edit the font url to ensure it points to the right place (see above example).
    4. +
  4. + In the <head> of your html, reference the location to your font-awesome.css. +
    +<link rel="stylesheet" href="../css/bootstrap.css">
+<link rel="stylesheet" href="../css/font-awesome.css">
+
    +
    5. +
  5. Check out the examples to start using Font Awesome!
    6. +
+
+
+
+
+

Not using Bootstrap?

+

Font Awesome works just as well without Twitter Bootstrap.

+
+
+
    +
  1. Copy the Font Awesome font directory into your project.
    2. +
  2. Copy font-awesome.less or font-awesome.css into your project.
    3. +
  3. Open your project's font-awesome.less or font-awesome.css and edit the font url to ensure it points to the right place (see above example).
    4. +
  4. Check out the examples to start using Font Awesome!
    5. +
+
+
+
+ +
+

Code

+
+
+

Inline Icon

+

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

+
+
+
+
+ icon-camera-retro +
+
+
+<div style="font-size: 24px;">
+  <i class="icon-camera-retro"></i> icon-camera-retro
+</div>
+
+
Icon classes are echoed via CSS :before.
+

Increase the icon size by using the icon-large class. This increases the size by 33% relative to the font-size of the container.

+
+
+ icon-camera-retro +
+
+
+<div style="font-size: 24px;">
+  <i class="icon-camera-retro icon-large"></i> icon-camera-retro
+</div>
+
+
+
+
+
+

Buttons

+

+

+ + Refresh + + Checkout +

+

+ + Comment + + Delete +

+

+ + Settings + + More Info +

+

+
+
+

Font Awesome icons work great in buttons.

+
+<a class="btn" href="#">
+  <i class="icon-refresh"></i> Refresh</a>
+<a class="btn btn-success" href="#">
+  <i class="icon-shopping-cart icon-large"></i> Checkout</a>
+<a class="btn btn-large btn-primary" href="#">
+  <i class="icon-comment"></i> Comment</a>
+<a class="btn btn-danger" href="#">
+  <i class="icon-trash icon-large"></i> Delete</a>
+<a class="btn btn-small" href="#">
+  <i class="icon-cog"></i> Settings</a>
+<a class="btn btn-small btn-info" href="#">
+  <i class="icon-info-sign"></i> More Info</a>
+
+
+
+
+
+

Button groups

+

+

+ + + + +
+

+
+
+
+<div class="btn-group">
+  <a class="btn" href="#"><i class="icon-align-left"></i></a>
+  <a class="btn" href="#"><i class="icon-align-center"></i></a>
+  <a class="btn" href="#"><i class="icon-align-right"></i></a>
+  <a class="btn" href="#"><i class="icon-align-justify"></i></a>
+</div>
+
+
+
+
+
+

Button dropdowns

+

+

+ User + + + +
+
+

+
+
+<div class="btn-group">
+    <a class="btn btn-primary" href="#"><i class="icon-user"></i> User</a>
+    <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="icon-chevron-down"></span></a>
+    <ul class="dropdown-menu">
+        <li><a href="#"><i class="icon-pencil"></i> Edit</a></li>
+        <li><a href="#"><i class="icon-trash"></i> Delete</a></li>
+        <li><a href="#"><i class="icon-ban-circle"></i> Ban</a></li>
+        <li class="divider"></li>
+        <li><a href="#"><i class="i"></i> Make admin</a></li>
+    </ul>
+</div>
+
+
Don't forget to add the appropriate JavaScript to enable button dropdowns.
+
+
+
+
+

Lists

+

+

    +
  • Lists
    • +
  • Buttons
    • +
  • Button groups
    • +
  • Navigation
    • +
  • Prepended form inputs
    • +
+

+
+
+

Easily replace individual bullets.

+
+<ul>
+  <li class="icon-ok">Lists</li>
+  <li class="icon-ok">Buttons</li>
+  <li class="icon-ok">Button groups</li>
+  <li class="icon-ok">Navigation</li>
+  <li class="icon-ok">Prepended form inputs</li>
+</ul>
+
+
+
+
+
+

Navigation

+
+ +
+
+
+

Use Font Awesome icons in navigation to provide helpful visual cues.

+
+<ul class="nav nav-list">
+  <li class="active"><a href="#"><i class="icon-home"></i> Home</a></li>
+  <li><a href="#"><i class="icon-book"></i> Library</a></li>
+  <li><a href="#"><i class="icon-pencil"></i> Applications</a></li>
+  <li><a href="#"><i class="icon-cogs"></i> Settings</a></li>
+</ul>
+
+
+
+
+
+

Prepended form inputs

+

+

+
+ + +
+
+ + +
+
+

+
+
+
+<form>
+  <div class="input-prepend">
+    <span class="add-on"><i class="icon-envelope"></i></span>
+    <input class="span2" type="text" placeholder="Email address">
+  </div>
+  <div class="input-prepend">
+    <span class="add-on"><i class="icon-key"></i></span>
+    <input class="span2" type="password" placeholder="Password">
+  </div>
+</form>
+
+
+
+
+
+

Custom CSS

+

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

+
+
+

Star Ratings (inspired by CSS Tricks)

+
+ + + +
+
+
+
+ +
+

Roadmap

+

Here's the plan for future updates.

+
    +
  • Support for IE7.
    • +
  • Better hinting for smaller font sizes.
    • +
  • More icons. Have any requests? Open an issue in the Font Awesome GitHub project.
    • +
  • More complete Twitter Bootstrap compatibility.
    • +
  • Tricks and tips for super-awesome creative CSS methods, like the star example above.
    • +
+
+ +
+
+
+

Contact

+ +
+
+

License

+ The Font Awesome webfont, CSS, and LESS files are licensed under + CC BY 3.0. + A mention of Font Awesome - http://fortawesome.github.com/Font-Awesome in human-readable source code + is considered acceptable attribution (most common on the web). If human readable source code is not available to + the end user, a mention in an 'About' or 'Credits' screen is considered acceptable (most common in desktop or + mobile software). +
+
+

Special Thanks

+ Special thanks to @robmadole and + @supercodepoet for icon design + review, advice, and some backbone.js help. +
+
+
+ + +
+ + + + + + + + + + + + + + + + + + + + + + + + -- cgit v1.2.1