mirror of
https://github.com/FortAwesome/Font-Awesome.git
synced 2024-12-26 21:41:29 +08:00
massive update to doc structure & build
This commit is contained in:
davegandy
parent
2921f35f31
commit
fd07665888
4
.gitignore
vendored
4
.gitignore
vendored
@ -8,6 +8,7 @@
|
||||
.coverage
|
||||
.DS_Store
|
||||
.installed.cfg
|
||||
_gh_pages/*
|
||||
|
||||
.idea/*
|
||||
.svn/*
|
||||
@ -15,14 +16,13 @@ src/website/static/*
|
||||
src/website/media/*
|
||||
|
||||
bin
|
||||
build
|
||||
cfcache
|
||||
develop-eggs
|
||||
dist
|
||||
downloads
|
||||
eggs
|
||||
parts
|
||||
tmp
|
||||
tmp
|
||||
.sass-cache
|
||||
|
||||
src/website/settingslocal.py
|
||||
|
||||
40
_config.yml
Normal file
40
_config.yml
Normal file
@ -0,0 +1,40 @@
|
||||
safe: false
|
||||
auto: true
|
||||
server: true
|
||||
server_port: 7998
|
||||
baseurl: /Font-Awesome/
|
||||
url: http://localhost:7998
|
||||
|
||||
source: build
|
||||
destination: _gh_pages
|
||||
plugins: build/_plugins
|
||||
|
||||
icon_meta: build/icons.yml
|
||||
icon_layout: icon.html # Relative to _layouts directory
|
||||
icon_destination: icon # Relative to destination
|
||||
|
||||
font-awesome:
|
||||
version: 3.1.0
|
||||
url: http://fortawesome.github.com/Font-Awesome/
|
||||
author:
|
||||
name: Dave Gandy
|
||||
email: dave@davegandy.com
|
||||
github:
|
||||
url: https://github.com/FortAwesome/Font-Awesome
|
||||
project: Font-Awesome
|
||||
org: FortAwesome
|
||||
|
||||
bootstrap:
|
||||
version: 2.3.1
|
||||
url: http://getbootstrap.com
|
||||
|
||||
license:
|
||||
font:
|
||||
version: SIL OFL 1.1
|
||||
url: http://scripts.sil.org/OFL
|
||||
code:
|
||||
version: MIT License
|
||||
url: http://opensource.org/licenses/mit-license.html
|
||||
documentation:
|
||||
version: CC BY 3.0
|
||||
url: http://creativecommons.org/licenses/by/3.0/
|
||||
1
build/_includes/ads/carbon-dark-vertical.html
Normal file
1
build/_includes/ads/carbon-dark-vertical.html
Normal file
@ -0,0 +1 @@
|
||||
<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script type="text/javascript">var z = document.createElement("script"); z.type = "text/javascript"; z.async = true; z.src = "http://engine.carbonads.com/z/32291/azcarbon_2_1_0_VERTDARK"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>
|
||||
1
build/_includes/ads/carbon-light-horizontal.html
Normal file
1
build/_includes/ads/carbon-light-horizontal.html
Normal file
@ -0,0 +1 @@
|
||||
<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script type="text/javascript">var z = document.createElement("script"); z.type = "text/javascript"; z.async = true; z.src = "http://engine.carbonads.com/z/32291/azcarbon_2_1_0_HORIZ"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>
|
||||
38
build/_includes/contribute.html
Normal file
38
build/_includes/contribute.html
Normal file
@ -0,0 +1,38 @@
|
||||
<section id="contribute">
|
||||
<h2 class="page-header">Contribute Icons to Font Awesome</h2>
|
||||
<div class="row">
|
||||
<div class="span3">
|
||||
<img class="img-rounded" src="assets/img/contribution-sample.png">
|
||||
</div>
|
||||
<div class="span9">
|
||||
<p class="lead">
|
||||
Want to help make Font Awesome even more awesome? Contribute back to the Font Awesome community by designing
|
||||
new pictograms for the set.
|
||||
</p>
|
||||
<p>
|
||||
If selected, you'll retain the CC-BY license to your pictogram and get attribution
|
||||
right here on the Font Awesome site.
|
||||
</p>
|
||||
<h3>How to Submit New Icons</h3>
|
||||
<ol>
|
||||
<li>Download the <a href="assets/img/icon-flag.pdf">icon-flag.pdf template</a>.</li>
|
||||
<li>
|
||||
Open the PDF in Adobe Illustrator. You'll notice the file has dimensions of 60x56. This is exactly 4x the
|
||||
max icon size of 15 wide by 14 tall. The template is an example of the flag icon to use as a guide.
|
||||
</li>
|
||||
<li>
|
||||
Design your icon. In order to make it into the set, your icon must look pixel perfect. The easiest way to do
|
||||
this is to make sure your line widths in the template are some multiple of 4px. Diagonals are rough, too.
|
||||
Don't split pixels right down the middle, as they blur more when rendering. Zoom out to 25% to get a good idea
|
||||
of how it will render in the font.
|
||||
</li>
|
||||
<li>
|
||||
Submit your icon. Drop me an email at <a href="mailto:dave@davegandy.com">dave@davegandy.com</a>. Make sure to
|
||||
use the subject <code>[Font Awesome] [Icon Contribution] icon-name</code> and attach your PDF file. If your
|
||||
icon makes it into Font Awesome (I'm keeping a very tight reign on quality), I'll ask what contact info you'd
|
||||
like to use for attribution.
|
||||
</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
443
build/_includes/examples.html
Normal file
443
build/_includes/examples.html
Normal file
@ -0,0 +1,443 @@
|
||||
<section id="examples">
|
||||
<h2 class="page-header">Examples</h2>
|
||||
<p>Many examples re-used from the Twitter Bootstrap documentation.</p>
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<div class="well well-transparent">
|
||||
<p>Use Font Awesome icons in:</p>
|
||||
<ul class="icons">
|
||||
<li><i class="icon-ok"></i>Bulleted lists (like this one)</li>
|
||||
<li><i class="icon-ok"></i>Buttons</li>
|
||||
<li><i class="icon-ok"></i>Button groups</li>
|
||||
<li><i class="icon-ok"></i>Navigation</li>
|
||||
<li><i class="icon-ok"></i>Prepended form inputs</li>
|
||||
<li><i class="icon-ok"></i>And many more with Custom CSS</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<p>
|
||||
<a class="btn" href="#"><i class="icon-repeat"></i> Reload</a>
|
||||
<a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-large"></i> Checkout</a>
|
||||
<a class="btn btn-danger" href="#"><i class="icon-trash icon-large"></i> Delete</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-large btn-primary" href="#"><i class="icon-comment"></i> Comment</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> Info</a>
|
||||
</p>
|
||||
<div class="well" style="padding: 8px 0;">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<div class="btn-toolbar">
|
||||
<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>
|
||||
<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-caret-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>
|
||||
</div>
|
||||
<form>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="icon-envelope"></i></span>
|
||||
<input class="span2" id="inputIcon" type="text" placeholder="Email address">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<div class="controls">
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="icon-key"></i></span>
|
||||
<input class="span2" id="inputIcon2" type="text" placeholder="Password">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<div>
|
||||
<span class="rating">
|
||||
<span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 class="page-header">New Styles in 3.0</h3>
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<i class="icon-quote-left icon-4x pull-left icon-muted"></i>
|
||||
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. Lots of new possibilities.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<div class="well well-large well-transparent lead">
|
||||
<i class="icon-spinner icon-spin icon-2x pull-left"></i> Spinner icon when loading content...
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<p>
|
||||
<a class="btn btn-large btn-danger" href="#"><i class="icon-flag icon-2x pull-left"></i>Font Awesome<br>Version 3.0</a>
|
||||
</p>
|
||||
<a class="btn btn-primary" href="#"><i class="icon-refresh icon-spin"></i> Synchronizing Content...</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3 class="page-header">Example HTML</h3>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Inline Icons</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>Place Font Awesome icons just about anywhere with the <code><i></code> tag.</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<div class="well well-transparent">
|
||||
<div style="font-size: 24px; line-height: 1.5em;">
|
||||
<i class="icon-camera-retro"></i> icon-camera-retro
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<i class="icon-camera-retro"></i> icon-camera-retro
|
||||
</pre>
|
||||
<div class="alert alert-info"><i class="icon-info-sign"></i> Icon classes are echoed via CSS :before.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Larger Icons</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
To increase the size of icons relative to its container, use <code>icon-large</code>, <code>icon-2x</code>,
|
||||
<code>icon-3x</code>, or <code>icon-4x</code>.
|
||||
</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<p>
|
||||
Increase the icon size by using the <code>icon-large</code> (33% increase), <code>icon-2x</code>,
|
||||
<code>icon-3x</code>, or <code>icon-4x</code> classes.
|
||||
</p>
|
||||
<div class="well well-transparent">
|
||||
<div style="font-size: 24px; line-height: 1.5em;">
|
||||
<p><i class="icon-camera-retro icon-large"></i> icon-camera-retro</p>
|
||||
<p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
|
||||
<p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
|
||||
<p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>
|
||||
</div>
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<p><i class="icon-camera-retro icon-large"></i> icon-camera-retro</p>
|
||||
<p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
|
||||
<p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
|
||||
<p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>
|
||||
</pre>
|
||||
<div class="alert alert-info">
|
||||
<i class="icon-info-sign"></i> If your icons are getting chopped off on top and bottom, make sure you have
|
||||
sufficient line-height.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Animated Spinner</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
Use the <code>icon-spin</code> class to get any icon to rotate. Works best with <code>icon-spinner</code> and
|
||||
<code>icon-refresh</code>.
|
||||
</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<div class="well well-large well-transparent lead">
|
||||
<i class="icon-spinner icon-spin"></i> Spinner icon when loading content...
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<i class="icon-spinner icon-spin"></i> Spinner icon when loading content...
|
||||
</pre>
|
||||
<p class="alert alert-info">
|
||||
<i class="icon-info-sign"></i> CSS3 animations aren't supported in IE7 - IE9.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span3">
|
||||
|
||||
</div>
|
||||
<div class="span9">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Bordered & Pulled Icons</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
Use <code>icon-border</code> and <code>pull-right</code> or <code>pull-left</code> for easy pull quotes or
|
||||
article graphics.
|
||||
</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<div class="well well-large well-transparent">
|
||||
<i class="icon-quote-left icon-4x pull-left icon-muted"></i>
|
||||
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.
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<i class="icon-quote-left icon-4x pull-left icon-muted"></i>
|
||||
Use a few of the new styles together ... lots of new possibilities.
|
||||
</pre>
|
||||
<div class="well well-large well-transparent">
|
||||
<i class="icon-flag icon-4x pull-left icon-border"></i>
|
||||
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.
|
||||
</div>
|
||||
<pre class="prettyprint linenums">
|
||||
<i class="icon-flag icon-4x pull-left icon-border"></i>
|
||||
Use a few of the new styles together ... lots of new possibilities.
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Buttons</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
<a class="btn" href="#">
|
||||
<i class="icon-repeat"></i> Reload</a>
|
||||
<a class="btn btn-success" href="#">
|
||||
<i class="icon-shopping-cart icon-large"></i> Checkout</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-large btn-primary" href="#">
|
||||
<i class="icon-comment"></i> Comment</a>
|
||||
<a class="btn btn-small btn-info" href="#">
|
||||
<i class="icon-info-sign"></i> Info</a>
|
||||
</p>
|
||||
<p>
|
||||
<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>
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-large btn-danger" href="#"><i class="icon-flag icon-2x pull-left"></i>Font Awesome<br>Version 3.0</a>
|
||||
</p>
|
||||
<p>
|
||||
<a class="btn btn-primary" href="#"><i class="icon-refresh icon-spin"></i> Synchronizing Content...</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div class="span9">
|
||||
<p>
|
||||
Font Awesome icons work great in buttons. You can even combine them with larger icon styles,
|
||||
<code>pull-right</code> and <code>pull-left</code>, and <code>icon-spin</code>.
|
||||
</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<a class="btn" href="#">
|
||||
<i class="icon-repeat"></i> Reload</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-small btn-info" href="#">
|
||||
<i class="icon-info-sign"></i> Info</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-large btn-danger" href="#">
|
||||
<i class="icon-flag icon-2x pull-left"></i>Font Awesome<br>Version 3.0</a>
|
||||
<a class="btn btn-primary" href="#">
|
||||
<i class="icon-refresh icon-spin"></i> Synchronizing Content...</a>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Button groups</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
<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>
|
||||
</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<pre class="prettyprint linenums">
|
||||
<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>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Button dropdowns</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
<div class="btn-group open">
|
||||
<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-caret-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>
|
||||
</div>
|
||||
</p>
|
||||
<div class="span9">
|
||||
<pre class="prettyprint linenums">
|
||||
<div class="btn-group open">
|
||||
<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-caret-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>
|
||||
</pre>
|
||||
<div class="alert alert-info"><i class="icon-info-sign"></i> Don't forget to add the appropriate JavaScript to enable button dropdowns.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Lists</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
<ul class="icons">
|
||||
<li><i class="icon-ok"></i> Lists</li>
|
||||
<li><i class="icon-ok"></i> Buttons</li>
|
||||
<li><i class="icon-ok"></i> Button groups</li>
|
||||
<li><i class="icon-ok"></i> Navigation</li>
|
||||
<li><i class="icon-ok"></i> Prepended form inputs</li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<p>Easily replace individual bullets.</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<ul class="icons">
|
||||
<li><i class="icon-ok"></i> Lists</li>
|
||||
<li><i class="icon-ok"></i> Buttons</li>
|
||||
<li><i class="icon-ok"></i> Button groups</li>
|
||||
<li><i class="icon-ok"></i> Navigation</li>
|
||||
<li><i class="icon-ok"></i> Prepended form inputs</li>
|
||||
</ul>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Navigation</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<div class="well" style="padding: 8px 0;">
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<p>Use Font Awesome icons in navigation to provide helpful visual cues.</p>
|
||||
<pre class="prettyprint linenums">
|
||||
<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>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Prepended form inputs</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>
|
||||
<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>
|
||||
</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<pre class="prettyprint linenums">
|
||||
<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>
|
||||
</pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Custom CSS</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>Anything you can do with CSS font styles, you can do with Font Awesome.</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<p>Star Ratings (inspired by <a href="http://css-tricks.com/star-ratings/" target="_blank">CSS Tricks</a>)</p>
|
||||
<div class="well">
|
||||
<span class="rating">
|
||||
<span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
21
build/_includes/footer.html
Normal file
21
build/_includes/footer.html
Normal file
@ -0,0 +1,21 @@
|
||||
<footer class="footer">
|
||||
<div class="container text-center">
|
||||
<div>
|
||||
<i class="icon-flag"></i> Font Awesome {{ site.font-awesome.version }} ·
|
||||
Created and Maintained by Dave Gandy ·
|
||||
<a href="http://twitter.com/byscuits">@byscuits</a>
|
||||
</div>
|
||||
<div>
|
||||
Font Awesome font licensed under <a href="{{ site.license.font.url }}">{{ site.license.font.version }}</a> ·
|
||||
Code licensed under <a href="{{ site.license.code.url }}">{{ site.license.code.version }}</a> ·
|
||||
Documentation licensed under <a href="{{ site.license.documentation.url }}">{{ site.license.documentation.version }}</a>
|
||||
</div>
|
||||
<div>
|
||||
Many doc examples taken from <a href="{{ site.bootstrap.url }}">Bootstrap's docs</a>
|
||||
</div>
|
||||
<div class="project">
|
||||
<a href="{{ site.font-awesome.github.url }}">GitHub Project</a> ·
|
||||
<a href="{{ site.font-awesome.github.url }}/issues">Issues</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
51
build/_includes/icons/directional.html
Normal file
51
build/_includes/icons/directional.html
Normal file
@ -0,0 +1,51 @@
|
||||
<section id="icons-directional" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">Directional Icons</h2>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/angle-left"><i class="icon-angle-left"></i> icon-angle-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/angle-right"><i class="icon-angle-right"></i> icon-angle-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/angle-up"><i class="icon-angle-up"></i> icon-angle-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/angle-down"><i class="icon-angle-down"></i> icon-angle-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/arrow-down"><i class="icon-arrow-down"></i> icon-arrow-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/arrow-left"><i class="icon-arrow-left"></i> icon-arrow-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/arrow-right"><i class="icon-arrow-right"></i> icon-arrow-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/arrow-up"><i class="icon-arrow-up"></i> icon-arrow-up</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/caret-down"><i class="icon-caret-down"></i> icon-caret-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/caret-left"><i class="icon-caret-left"></i> icon-caret-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/caret-right"><i class="icon-caret-right"></i> icon-caret-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/caret-up"><i class="icon-caret-up"></i> icon-caret-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/chevron-down"><i class="icon-chevron-down"></i> icon-chevron-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/chevron-left"><i class="icon-chevron-left"></i> icon-chevron-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/chevron-right"><i class="icon-chevron-right"></i> icon-chevron-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/chevron-up"><i class="icon-chevron-up"></i> icon-chevron-up</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/circle-arrow-down"><i class="icon-circle-arrow-down"></i> icon-circle-arrow-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle-arrow-left"><i class="icon-circle-arrow-left"></i> icon-circle-arrow-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle-arrow-right"><i class="icon-circle-arrow-right"></i> icon-circle-arrow-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle-arrow-up"><i class="icon-circle-arrow-up"></i> icon-circle-arrow-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/double-angle-left"><i class="icon-double-angle-left"></i> icon-double-angle-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/double-angle-right"><i class="icon-double-angle-right"></i> icon-double-angle-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/double-angle-up"><i class="icon-double-angle-up"></i> icon-double-angle-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/double-angle-down"><i class="icon-double-angle-down"></i> icon-double-angle-down</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/hand-down"><i class="icon-hand-down"></i> icon-hand-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/hand-left"><i class="icon-hand-left"></i> icon-hand-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/hand-right"><i class="icon-hand-right"></i> icon-hand-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/hand-up"><i class="icon-hand-up"></i> icon-hand-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle"><i class="icon-circle"></i> icon-circle</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle-blank"><i class="icon-circle-blank"></i> icon-circle-blank</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
29
build/_includes/icons/medical.html
Normal file
29
build/_includes/icons/medical.html
Normal file
@ -0,0 +1,29 @@
|
||||
<section id="icons-medical" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">Medical Icons <small>Want to change healthcare? Work with me at <a href="#kyruus">Kyruus</a>.</small></h2>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/ambulance"><i class="icon-ambulance"></i> icon-ambulance</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/beaker"><i class="icon-beaker"></i> icon-beaker</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/h-sign"><i class="icon-h-sign"></i> icon-h-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/hospital"><i class="icon-hospital"></i> icon-hospital</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/medkit"><i class="icon-medkit"></i> icon-medkit</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/plus-sign-alt"><i class="icon-plus-sign-alt"></i> icon-plus-sign-alt</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/stethoscope"><i class="icon-stethoscope"></i> icon-stethoscope</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/user-md"><i class="icon-user-md"></i> icon-user-md</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
48
build/_includes/icons/new.html
Normal file
48
build/_includes/icons/new.html
Normal file
@ -0,0 +1,48 @@
|
||||
<section id="icons-new" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">New Icons in {{ site.font-awesome.version }}</h2>
|
||||
<p>
|
||||
You asked, Font Awesome delivers with 40 shiny new icons in version {{ site.font-awesome.version }}. New icons can be requested on the
|
||||
<a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">Font Awesome GitHub project</a>. Or even
|
||||
better, you can <a href="#contribute">contribute your own icons</a>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/smile"><i class="icon-smile"></i> icon-smile</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/frown"><i class="icon-frown"></i> icon-frown</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/meh"><i class="icon-meh"></i> icon-meh</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/gamepad"><i class="icon-gamepad"></i> icon-gamepad</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/keyboard"><i class="icon-keyboard"></i> icon-keyboard</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/flag-alt"><i class="icon-flag-alt"></i> icon-flag-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/flag-checkered"><i class="icon-flag-checkered"></i> icon-flag-checkered</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/terminal"><i class="icon-terminal"></i> icon-terminal</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/code"><i class="icon-code"></i> icon-code</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/share-alt"><i class="icon-mail-forward"></i> icon-mail-forward <span class="muted">(alias)</span></a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/reply"><i class="icon-mail-reply"></i> icon-mail-reply <span class="muted">(alias)</span></a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/reply-all"><i class="icon-reply-all"></i> icon-reply-all</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/reply-all"><i class="icon-mail-reply-all"></i> icon-mail-reply-all <span class="muted">(alias)</span></a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/star-half-empty"><i class="icon-star-half-empty"></i> icon-star-half-empty</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/location-arrow"><i class="icon-location-arrow"></i> icon-location-arrow</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/undo"><i class="icon-rotate-left"></i> icon-rotate-left <span class="muted">(alias)</span></a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/repeat"><i class="icon-rotate-right"></i> icon-rotate-right <span class="muted">(alias)</span></a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/crop"><i class="icon-crop"></i> icon-crop</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/code-fork"><i class="icon-code-fork"></i> icon-code-fork</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/unlink"><i class="icon-unlink"></i> icon-unlink</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/question"><i class="icon-question"></i> icon-question</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/info"><i class="icon-info"></i> icon-info</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/exclamation"><i class="icon-exclamation"></i> icon-exclamation</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/superscript"><i class="icon-superscript"></i> icon-superscript</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/subscript"><i class="icon-subscript"></i> icon-subscript</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/eraser"><i class="icon-eraser"></i> icon-eraser</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/puzzle-piece"><i class="icon-puzzle-piece"></i> icon-puzzle-piece</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/microphone"><i class="icon-microphone"></i> icon-microphone</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/microphone-off"><i class="icon-microphone-off"></i> icon-microphone-off</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/shield"><i class="icon-shield"></i> icon-shield</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/calendar-empty"><i class="icon-calendar-empty"></i> icon-calendar-empty</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/fire-extinguisher"><i class="icon-fire-extinguisher"></i> icon-fire-extinguisher</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/rocket"><i class="icon-rocket"></i> icon-rocket</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
37
build/_includes/icons/social.html
Normal file
37
build/_includes/icons/social.html
Normal file
@ -0,0 +1,37 @@
|
||||
<section id="icons-social" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">Social Icons</h2>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/phone"><i class="icon-phone"></i> icon-phone</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/phone-sign"><i class="icon-phone-sign"></i> icon-phone-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/facebook"><i class="icon-facebook"></i> icon-facebook</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/facebook-sign"><i class="icon-facebook-sign"></i> icon-facebook-sign</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/twitter"><i class="icon-twitter"></i> icon-twitter</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/twitter-sign"><i class="icon-twitter-sign"></i> icon-twitter-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/github"><i class="icon-github"></i> icon-github</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/github-alt"><i class="icon-github-alt"></i> icon-github-alt</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/github-sign"><i class="icon-github-sign"></i> icon-github-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/linkedin"><i class="icon-linkedin"></i> icon-linkedin</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/linkedin-sign"><i class="icon-linkedin-sign"></i> icon-linkedin-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/pinterest"><i class="icon-pinterest"></i> icon-pinterest</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/pinterest-sign"><i class="icon-pinterest-sign"></i> icon-pinterest-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/google-plus"><i class="icon-google-plus"></i> icon-google-plus</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/google-plus-sign"><i class="icon-google-plus-sign"></i> icon-google-plus-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/sign-blank"><i class="icon-sign-blank"></i> icon-sign-blank</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
53
build/_includes/icons/text-editor.html
Normal file
53
build/_includes/icons/text-editor.html
Normal file
@ -0,0 +1,53 @@
|
||||
<section id="icons-text-editor" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">Text Editor Icons</h2>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/file"><i class="icon-file"></i> icon-file</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/file-alt"><i class="icon-file-alt"></i> icon-file-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/cut"><i class="icon-cut"></i> icon-cut</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/copy"><i class="icon-copy"></i> icon-copy</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/paste"><i class="icon-paste"></i> icon-paste</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/save"><i class="icon-save"></i> icon-save</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/undo"><i class="icon-undo"></i> icon-undo</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/repeat"><i class="icon-repeat"></i> icon-repeat</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/text-height"><i class="icon-text-height"></i> icon-text-height</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/text-width"><i class="icon-text-width"></i> icon-text-width</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/align-left"><i class="icon-align-left"></i> icon-align-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/align-center"><i class="icon-align-center"></i> icon-align-center</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/align-right"><i class="icon-align-right"></i> icon-align-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/align-justify"><i class="icon-align-justify"></i> icon-align-justify</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/indent-left"><i class="icon-indent-left"></i> icon-indent-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/indent-right"><i class="icon-indent-right"></i> icon-indent-right</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/font"><i class="icon-font"></i> icon-font</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bold"><i class="icon-bold"></i> icon-bold</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/italic"><i class="icon-italic"></i> icon-italic</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/strikethrough"><i class="icon-strikethrough"></i> icon-strikethrough</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/underline"><i class="icon-underline"></i> icon-underline</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/link"><i class="icon-link"></i> icon-link</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/paper-clip"><i class="icon-paper-clip"></i> icon-paper-clip</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/columns"><i class="icon-columns"></i> icon-columns</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/table"><i class="icon-table"></i> icon-table</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/th-large"><i class="icon-th-large"></i> icon-th-large</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/th"><i class="icon-th"></i> icon-th</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/th-list"><i class="icon-th-list"></i> icon-th-list</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/list"><i class="icon-list"></i> icon-list</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/list-ol"><i class="icon-list-ol"></i> icon-list-ol</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/list-ul"><i class="icon-list-ul"></i> icon-list-ul</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/list-alt"><i class="icon-list-alt"></i> icon-list-alt</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
35
build/_includes/icons/video-player.html
Normal file
35
build/_includes/icons/video-player.html
Normal file
@ -0,0 +1,35 @@
|
||||
<section id="icons-video-player" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">Video Player Icons</h2>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/play-circle"><i class="icon-play-circle"></i> icon-play-circle</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/play"><i class="icon-play"></i> icon-play</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/pause"><i class="icon-pause"></i> icon-pause</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/stop"><i class="icon-stop"></i> icon-stop</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/step-backward"><i class="icon-step-backward"></i> icon-step-backward</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/fast-backward"><i class="icon-fast-backward"></i> icon-fast-backward</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/backward"><i class="icon-backward"></i> icon-backward</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/forward"><i class="icon-forward"></i> icon-forward</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/fast-forward"><i class="icon-fast-forward"></i> icon-fast-forward</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/step-forward"><i class="icon-step-forward"></i> icon-step-forward</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/eject"><i class="icon-eject"></i> icon-eject</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/fullscreen"><i class="icon-fullscreen"></i> icon-fullscreen</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/resize-full"><i class="icon-resize-full"></i> icon-resize-full</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/resize-small"><i class="icon-resize-small"></i> icon-resize-small</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
174
build/_includes/icons/web-app.html
Normal file
174
build/_includes/icons/web-app.html
Normal file
@ -0,0 +1,174 @@
|
||||
|
||||
<section id="icons-web-app" class="row">
|
||||
<div class="span12">
|
||||
<h2 class="page-header">Web Application Icons</h2>
|
||||
</div>
|
||||
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/adjust"><i class="icon-adjust"></i> icon-adjust</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/asterisk"><i class="icon-asterisk"></i> icon-asterisk</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/ban-circle"><i class="icon-ban-circle"></i> icon-ban-circle</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bar-chart"><i class="icon-bar-chart"></i> icon-bar-chart</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/barcode"><i class="icon-barcode"></i> icon-barcode</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/beaker"><i class="icon-beaker"></i> icon-beaker</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/beer"><i class="icon-beer"></i> icon-beer</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bell"><i class="icon-bell"></i> icon-bell</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bell-alt"><i class="icon-bell-alt"></i> icon-bell-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bolt"><i class="icon-bolt"></i> icon-bolt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/book"><i class="icon-book"></i> icon-book</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bookmark"><i class="icon-bookmark"></i> icon-bookmark</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bookmark-empty"><i class="icon-bookmark-empty"></i> icon-bookmark-empty</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/briefcase"><i class="icon-briefcase"></i> icon-briefcase</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/bullhorn"><i class="icon-bullhorn"></i> icon-bullhorn</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/calendar"><i class="icon-calendar"></i> icon-calendar</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/camera"><i class="icon-camera"></i> icon-camera</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/camera-retro"><i class="icon-camera-retro"></i> icon-camera-retro</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/certificate"><i class="icon-certificate"></i> icon-certificate</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/check"><i class="icon-check"></i> icon-check</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/check-empty"><i class="icon-check-empty"></i> icon-check-empty</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle"><i class="icon-circle"></i> icon-circle</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/circle-blank"><i class="icon-circle-blank"></i> icon-circle-blank</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/cloud"><i class="icon-cloud"></i> icon-cloud</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/cloud-download"><i class="icon-cloud-download"></i> icon-cloud-download</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/cloud-upload"><i class="icon-cloud-upload"></i> icon-cloud-upload</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/coffee"><i class="icon-coffee"></i> icon-coffee</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/cog"><i class="icon-cog"></i> icon-cog</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/cogs"><i class="icon-cogs"></i> icon-cogs</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/comment"><i class="icon-comment"></i> icon-comment</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/comment-alt"><i class="icon-comment-alt"></i> icon-comment-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/comments"><i class="icon-comments"></i> icon-comments</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/comments-alt"><i class="icon-comments-alt"></i> icon-comments-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/credit-card"><i class="icon-credit-card"></i> icon-credit-card</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/dashboard"><i class="icon-dashboard"></i> icon-dashboard</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/desktop"><i class="icon-desktop"></i> icon-desktop</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/download"><i class="icon-download"></i> icon-download</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/download-alt"><i class="icon-download-alt"></i> icon-download-alt</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/edit"><i class="icon-edit"></i> icon-edit</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/envelope"><i class="icon-envelope"></i> icon-envelope</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/envelope-alt"><i class="icon-envelope-alt"></i> icon-envelope-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/exchange"><i class="icon-exchange"></i> icon-exchange</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/exclamation-sign"><i class="icon-exclamation-sign"></i> icon-exclamation-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/external-link"><i class="icon-external-link"></i> icon-external-link</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/eye-close"><i class="icon-eye-close"></i> icon-eye-close</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/eye-open"><i class="icon-eye-open"></i> icon-eye-open</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/facetime-video"><i class="icon-facetime-video"></i> icon-facetime-video</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/fighter-jet"><i class="icon-fighter-jet"></i> icon-fighter-jet</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/film"><i class="icon-film"></i> icon-film</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/filter"><i class="icon-filter"></i> icon-filter</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/fire"><i class="icon-fire"></i> icon-fire</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/flag"><i class="icon-flag"></i> icon-flag</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/folder-close"><i class="icon-folder-close"></i> icon-folder-close</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/folder-open"><i class="icon-folder-open"></i> icon-folder-open</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/folder-close-alt"><i class="icon-folder-close-alt"></i> icon-folder-close-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/folder-open-alt"><i class="icon-folder-open-alt"></i> icon-folder-open-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/food"><i class="icon-food"></i> icon-food</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/gift"><i class="icon-gift"></i> icon-gift</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/glass"><i class="icon-glass"></i> icon-glass</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/globe"><i class="icon-globe"></i> icon-globe</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/group"><i class="icon-group"></i> icon-group</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/hdd"><i class="icon-hdd"></i> icon-hdd</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/headphones"><i class="icon-headphones"></i> icon-headphones</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/heart"><i class="icon-heart"></i> icon-heart</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/heart-empty"><i class="icon-heart-empty"></i> icon-heart-empty</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/home"><i class="icon-home"></i> icon-home</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/inbox"><i class="icon-inbox"></i> icon-inbox</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/info-sign"><i class="icon-info-sign"></i> icon-info-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/key"><i class="icon-key"></i> icon-key</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/leaf"><i class="icon-leaf"></i> icon-leaf</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/laptop"><i class="icon-laptop"></i> icon-laptop</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/legal"><i class="icon-legal"></i> icon-legal</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/lemon"><i class="icon-lemon"></i> icon-lemon</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/lightbulb"><i class="icon-lightbulb"></i> icon-lightbulb</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/lock"><i class="icon-lock"></i> icon-lock</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/unlock"><i class="icon-unlock"></i> icon-unlock</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/magic"><i class="icon-magic"></i> icon-magic</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/magnet"><i class="icon-magnet"></i> icon-magnet</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/map-marker"><i class="icon-map-marker"></i> icon-map-marker</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/minus"><i class="icon-minus"></i> icon-minus</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/minus-sign"><i class="icon-minus-sign"></i> icon-minus-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/mobile-phone"><i class="icon-mobile-phone"></i> icon-mobile-phone</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/money"><i class="icon-money"></i> icon-money</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/move"><i class="icon-move"></i> icon-move</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/music"><i class="icon-music"></i> icon-music</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/off"><i class="icon-off"></i> icon-off</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/ok"><i class="icon-ok"></i> icon-ok</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/ok-circle"><i class="icon-ok-circle"></i> icon-ok-circle</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/ok-sign"><i class="icon-ok-sign"></i> icon-ok-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/pencil"><i class="icon-pencil"></i> icon-pencil</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/picture"><i class="icon-picture"></i> icon-picture</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/plane"><i class="icon-plane"></i> icon-plane</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/plus"><i class="icon-plus"></i> icon-plus</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/plus-sign"><i class="icon-plus-sign"></i> icon-plus-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/print"><i class="icon-print"></i> icon-print</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/pushpin"><i class="icon-pushpin"></i> icon-pushpin</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/qrcode"><i class="icon-qrcode"></i> icon-qrcode</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/question-sign"><i class="icon-question-sign"></i> icon-question-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/quote-left"><i class="icon-quote-left"></i> icon-quote-left</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/quote-right"><i class="icon-quote-right"></i> icon-quote-right</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/random"><i class="icon-random"></i> icon-random</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/refresh"><i class="icon-refresh"></i> icon-refresh</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/remove"><i class="icon-remove"></i> icon-remove</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/remove-circle"><i class="icon-remove-circle"></i> icon-remove-circle</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/remove-sign"><i class="icon-remove-sign"></i> icon-remove-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/reorder"><i class="icon-reorder"></i> icon-reorder</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/reply"><i class="icon-reply"></i> icon-reply</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/resize-horizontal"><i class="icon-resize-horizontal"></i> icon-resize-horizontal</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/resize-vertical"><i class="icon-resize-vertical"></i> icon-resize-vertical</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/retweet"><i class="icon-retweet"></i> icon-retweet</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/road"><i class="icon-road"></i> icon-road</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/rss"><i class="icon-rss"></i> icon-rss</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/screenshot"><i class="icon-screenshot"></i> icon-screenshot</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/search"><i class="icon-search"></i> icon-search</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<ul class="the-icons">
|
||||
<li><a href="{{ site.baseurl }}icon/share"><i class="icon-share"></i> icon-share</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/share-alt"><i class="icon-share-alt"></i> icon-share-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/shopping-cart"><i class="icon-shopping-cart"></i> icon-shopping-cart</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/signal"><i class="icon-signal"></i> icon-signal</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/signin"><i class="icon-signin"></i> icon-signin</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/signout"><i class="icon-signout"></i> icon-signout</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/sitemap"><i class="icon-sitemap"></i> icon-sitemap</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/sort"><i class="icon-sort"></i> icon-sort</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/sort-down"><i class="icon-sort-down"></i> icon-sort-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/sort-up"><i class="icon-sort-up"></i> icon-sort-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/spinner"><i class="icon-spinner"></i> icon-spinner</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/star"><i class="icon-star"></i> icon-star</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/star-empty"><i class="icon-star-empty"></i> icon-star-empty</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/star-half"><i class="icon-star-half"></i> icon-star-half</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/tablet"><i class="icon-tablet"></i> icon-tablet</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/tag"><i class="icon-tag"></i> icon-tag</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/tags"><i class="icon-tags"></i> icon-tags</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/tasks"><i class="icon-tasks"></i> icon-tasks</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/thumbs-down"><i class="icon-thumbs-down"></i> icon-thumbs-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/thumbs-up"><i class="icon-thumbs-up"></i> icon-thumbs-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/time"><i class="icon-time"></i> icon-time</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/tint"><i class="icon-tint"></i> icon-tint</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/trash"><i class="icon-trash"></i> icon-trash</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/trophy"><i class="icon-trophy"></i> icon-trophy</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/truck"><i class="icon-truck"></i> icon-truck</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/umbrella"><i class="icon-umbrella"></i> icon-umbrella</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/upload"><i class="icon-upload"></i> icon-upload</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/upload-alt"><i class="icon-upload-alt"></i> icon-upload-alt</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/user"><i class="icon-user"></i> icon-user</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/user-md"><i class="icon-user-md"></i> icon-user-md</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/volume-off"><i class="icon-volume-off"></i> icon-volume-off</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/volume-down"><i class="icon-volume-down"></i> icon-volume-down</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/volume-up"><i class="icon-volume-up"></i> icon-volume-up</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/warning-sign"><i class="icon-warning-sign"></i> icon-warning-sign</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/wrench"><i class="icon-wrench"></i> icon-wrench</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/zoom-in"><i class="icon-zoom-in"></i> icon-zoom-in</a></li>
|
||||
<li><a href="{{ site.baseurl }}icon/zoom-out"><i class="icon-zoom-out"></i> icon-zoom-out</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
101
build/_includes/integration.html
Normal file
101
build/_includes/integration.html
Normal file
@ -0,0 +1,101 @@
|
||||
<section id="integration">
|
||||
<h2 class="page-header">Integration</h2>
|
||||
<p>It's easy to integrate Font Awesome into Twitter Bootstrap, or even use it on its own.</p>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Easy Bootstrap + Font Awesome Integration</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>Use this method to integrate Font Awesome with the default Bootstrap CSS.</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<ol>
|
||||
<li>Copy the Font Awesome font directory into your project.</li>
|
||||
<li>Copy font-awesome.min.css into your project.</li>
|
||||
<li>
|
||||
Open your project's font-awesome.min.css and edit the font paths to ensure they point to the right place.
|
||||
<p class="alert alert-info"><i class="icon-info-sign"></i> The font path is relative from your CSS directory.</p>
|
||||
</li>
|
||||
<li>
|
||||
In the <code><head></code> of your html, reference the location to your font-awesome.min.css.
|
||||
<pre class="prettyprint linenums">
|
||||
<link rel="stylesheet" href="../css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../css/font-awesome.min.css">
|
||||
</pre>
|
||||
</li>
|
||||
<li>Check out the examples to start using Font Awesome!</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Custom Bootstrap + Font Awesome Integration using LESS</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>Use this method to integrate Font Awesome with Twitter Bootstrap using LESS.</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<ol>
|
||||
<li>Copy the Font Awesome font directory into your project.</li>
|
||||
<li>Copy font-awesome.less into your bootstrap/less directory.</li>
|
||||
<li>Open bootstrap.less and replace <code>@import "sprites.less";</code> with <code>@import "font-awesome.less";</code></li>
|
||||
<li>
|
||||
Open your project's font-awesome.less and edit the <code>@FontAwesomePath</code> variable to point to your font directory.
|
||||
<pre class="prettyprint linenums">
|
||||
@FontAwesomePath: "../font";
|
||||
</pre>
|
||||
<p class="alert alert-info"><i class="icon-info-sign"></i> The font path is relative from your compiled CSS directory.</p>
|
||||
</li>
|
||||
<li>Re-compile your LESS if using a static compiler. Otherwise, you should be good to go.</li>
|
||||
<li>Check out the examples to start using Font Awesome!</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Custom Bootstrap + Font Awesome Integration using SASS or SCSS</h4>
|
||||
<p>I have never used either, so let me know if the included SCSS or SASS files have issues.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Not using Bootstrap?</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>Font Awesome works just as well without Twitter Bootstrap.</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<ol>
|
||||
<li>Copy the Font Awesome font directory into your project.</li>
|
||||
<li>Copy font-awesome.less or font-awesome.min.css into your project.</li>
|
||||
<li>Open your project's font-awesome.less or font-awesome.min.css and edit the font location to point it to your font directory (see above examples).</li>
|
||||
<li>Check out the examples to start using Font Awesome!</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span12">
|
||||
<h4>Need IE7 Support?</h4>
|
||||
</div>
|
||||
<div class="span3">
|
||||
<p>Font Awesome supports IE7. If you need it, you have my condolences.</p>
|
||||
</div>
|
||||
<div class="span9">
|
||||
<ol>
|
||||
<li>Get Font Awesome working properly in a modern browser.</li>
|
||||
<li>Copy font-awesome-ie7.min.css into your project.</li>
|
||||
<li>
|
||||
In the <code><head></code> of your html, reference the location to your font-awesome-ie7.min.css.
|
||||
<pre class="prettyprint linenums">
|
||||
<link rel="stylesheet" href="../css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../css/font-awesome.min.css">
|
||||
<!--[if IE 7]>
|
||||
<link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css">
|
||||
<![endif]-->
|
||||
</pre>
|
||||
</li>
|
||||
<li>Go complain to whoever decided your project needs IE7 support.</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
56
build/_includes/jumbotron-slider.html
Normal file
56
build/_includes/jumbotron-slider.html
Normal file
@ -0,0 +1,56 @@
|
||||
<div class="jumbotron">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="span8">
|
||||
<div class="hero-content">
|
||||
<h1>Font Awesome</h1>
|
||||
<p>The iconic font designed for<br>use with Twitter Bootstrap</p>
|
||||
<div class="actions">
|
||||
<a class="btn btn-primary btn-large" href="https://github.com/FortAwesome/Font-Awesome/zipball/master"
|
||||
onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'Download on GitHub']);">
|
||||
<i class="icon-download icon-2x pull-left"></i>
|
||||
Download Font<br>Awesome {{ site.font-awesome.version }}</a>
|
||||
<a class="btn btn-large btn-github" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"
|
||||
onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'View Project on GitHub']);">
|
||||
<i class="icon-github icon-2x pull-left"></i>
|
||||
View Project<br>on GitHub</a>
|
||||
</div>
|
||||
<div class="shameless-self-promotion">
|
||||
Version {{ site.font-awesome.version }} • Created & Maintained by Dave Gandy
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="span4">
|
||||
<div id="iconCarousel" class="carousel slide">
|
||||
<!-- Carousel items -->
|
||||
<div class="carousel-inner">
|
||||
<div class="active item"><div><i class="icon-flag"></i></div></div>
|
||||
<div class="item"><div><i class="icon-rocket"></i></div></div>
|
||||
<div class="item"><div><i class="icon-crop"></i></div></div>
|
||||
<div class="item"><div><i class="icon-fire-extinguisher"></i></div></div>
|
||||
<div class="item"><div><i class="icon-microphone"></i></div></div>
|
||||
<div class="item"><div><i class="icon-shield"></i></div></div>
|
||||
<div class="item"><div><i class="icon-star-half-empty"></i></div></div>
|
||||
<div class="item"><div><i class="icon-envelope"></i></div></div>
|
||||
<div class="item"><div><i class="icon-coffee"></i></div></div>
|
||||
<div class="item"><div><i class="icon-medkit"></i></div></div>
|
||||
<div class="item"><div><i class="icon-book"></i></div></div>
|
||||
<div class="item"><div><i class="icon-fighter-jet"></i></div></div>
|
||||
<div class="item"><div><i class="icon-search"></i></div></div>
|
||||
<div class="item"><div><i class="icon-beer"></i></div></div>
|
||||
<div class="item"><div><i class="icon-heart-empty"></i></div></div>
|
||||
<div class="item"><div><i class="icon-thumbs-up"></i></div></div>
|
||||
</div>
|
||||
<!-- Carousel nav -->
|
||||
<a class="carousel-control left" href="#iconCarousel" data-slide="prev"
|
||||
onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Prev']);">
|
||||
<i class="icon-arrow-left"></i></a>
|
||||
<a class="carousel-control right" href="#iconCarousel" data-slide="next"
|
||||
onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Next']);">
|
||||
<i class="icon-arrow-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
7
build/_includes/jumbotron.html
Normal file
7
build/_includes/jumbotron.html
Normal file
@ -0,0 +1,7 @@
|
||||
<div class="jumbotron jumbotron-ad">
|
||||
<div class="container">
|
||||
<div class="pull-right">{% include ads/carbon-dark-vertical.html %}</div>
|
||||
<h1>{{ jumbotron_h1 }}</h1>
|
||||
<p>{{ jumbotron_p }}</p>
|
||||
</div>
|
||||
</div>
|
||||
19
build/_includes/navbar.html
Normal file
19
build/_includes/navbar.html
Normal file
@ -0,0 +1,19 @@
|
||||
<div class="navbar navbar-inverse navbar-static-top">
|
||||
<div class="navbar-inner">
|
||||
<div class="container">
|
||||
<a class="brand" href="{{ site.baseurl }}"><i class="icon-flag"></i> Font Awesome</a>
|
||||
<ul class="nav">
|
||||
<li{% if page.navbar_active == "home" %} class="active"{% endif %}><a href="{{ site.baseurl }}">Home</a></li>
|
||||
<li{% if page.navbar_active == "whats-new" %} class="active"{% endif %}><a href="{{ site.baseurl }}whats-new/">What's New</a></li>
|
||||
<li{% if page.navbar_active == "icons" %} class="active"{% endif %}><a href="{{ site.baseurl }}icons/">Icons</a></li>
|
||||
<li{% if page.navbar_active == "integration" %} class="active"{% endif %}><a href="{{ site.baseurl }}integration/">Integration</a></li>
|
||||
<li{% if page.navbar_active == "examples" %} class="active"{% endif %}><a href="{{ site.baseurl }}examples/">Examples</a></li>
|
||||
<li{% if page.navbar_active == "roadmap" %} class="active"{% endif %}><a href="{{ site.baseurl }}roadmap/">Roadmap</a></li>
|
||||
<li{% if page.navbar_active == "thanks" %} class="active"{% endif %}><a href="{{ site.baseurl }}thanks/">Say Thanks</a></li>
|
||||
</ul>
|
||||
<ul class="nav pull-right">
|
||||
<li><a href="mailto:{{ site.font-awesome.author.email }}"><i class="icon-envelope"></i> Me</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
9
build/_includes/roadmap.html
Normal file
9
build/_includes/roadmap.html
Normal file
@ -0,0 +1,9 @@
|
||||
<section id="roadmap">
|
||||
<h2 class="page-header">Roadmap</h2>
|
||||
<p>Here's the plan for future updates.</p>
|
||||
<ul class="icons">
|
||||
<li><i class="icon-plus"></i>Easier sub-setting with icon packs.</li>
|
||||
<li><i class="icon-plus"></i>More icons. Have any requests? <a href="https://github.com/FortAwesome/Font-Awesome/issues" target="_blank">Open an issue</a> in the Font Awesome GitHub project.</li>
|
||||
<li><i class="icon-plus"></i>Tricks and tips for super-awesome creative CSS methods, like the star example above.</li>
|
||||
</ul>
|
||||
</section>
|
||||
22
build/_includes/say-thanks.html
Normal file
22
build/_includes/say-thanks.html
Normal file
@ -0,0 +1,22 @@
|
||||
<section id="say-thanks">
|
||||
<p class="lead">
|
||||
Hopefully you think Font Awesome <em>is</em> awesome. I've put hundreds of hours into the project to give back to the
|
||||
open source community. If you'd like, here are a couple of ways you can tell me thanks for all my hard work.
|
||||
</p>
|
||||
<div class="row">
|
||||
<div class="span6">
|
||||
<h4><a href="http://www.shareagift.com/pages/giftpage.aspx?giftid=2472" target="_blank">Help me buy an iMac</a></h4>
|
||||
<p>
|
||||
<a href="http://www.shareagift.com/pages/giftpage.aspx?giftid=2472" target="_blank">Contribute</a> to a shiny
|
||||
new iMac for me to keep making great icons.
|
||||
</p>
|
||||
</div>
|
||||
<div class="span6">
|
||||
<h4><a href="http://amzn.com/w/G64X58AY416W" target="_blank">My Amazon Wish List</a></h4>
|
||||
<p>
|
||||
Or pick something straight
|
||||
from <a href="http://amzn.com/w/G64X58AY416W" target="_blank">my wish list</a>. Gift cards are great.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
14
build/_includes/special-thanks.html
Normal file
14
build/_includes/special-thanks.html
Normal file
@ -0,0 +1,14 @@
|
||||
<section id="special-thanks">
|
||||
<h2 class="page-header">Special Thanks</h2>
|
||||
<p>
|
||||
Special thanks to <a href="https://twitter.com/robmadole/" target="_blank">@robmadole</a> and
|
||||
<a href="https://twitter.com/supercodepoet/" target="_blank">@supercodepoet</a> for icon design
|
||||
review, advice, and some backbone.js help.
|
||||
</p>
|
||||
<p>
|
||||
Special thanks to <a target="_blank" href="https://twitter.com/grantgordon">@grantgordon</a> and
|
||||
<a target="_blank" href="https://twitter.com/johnsmclay">@johnsmclay</a> for developing
|
||||
<a target="_blank" href="http://icnfnt.com/">icnfnt</a>, the best way to subset Font Awesome to get just the
|
||||
icons you need.
|
||||
</p>
|
||||
</section>
|
||||
31
build/_includes/stripe-social.html
Normal file
31
build/_includes/stripe-social.html
Normal file
@ -0,0 +1,31 @@
|
||||
<div id="social-buttons">
|
||||
<div class="container">
|
||||
<ul class="unstyled inline">
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=FortAwesome&repo=Font-Awesome&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
|
||||
</li>
|
||||
<li>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=FortAwesome&repo=Font-Awesome&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
|
||||
</li>
|
||||
<li class="follow-btn">
|
||||
<a href="https://twitter.com/fortaweso_me" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @fortaweso_me</a>
|
||||
</li>
|
||||
<li class="tweet-btn">
|
||||
<a href="https://twitter.com/share" class="twitter-share-button" data-url="{{ site.font-awesome.url }}" data-count="horizontal" data-via="fortaweso_me" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!--<div class="watch">-->
|
||||
<!--<a class="btn btn-mini" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"><i class="icon-github icon-large"></i> Watch</a>-->
|
||||
<!--<a id="watchers" class="count btn btn-mini" href="https://github.com/FortAwesome/Font-Awesome">9000+</a>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="fork">-->
|
||||
<!--<a class="btn btn-mini" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"><i class="icon-github icon-large"></i> Fork</a>-->
|
||||
<!--<a id="forks" class="count btn btn-mini" href="#">800+</a>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="follow">-->
|
||||
<!--<a class="btn btn-mini" href="http://twitter.com/fortaweso_me/" target="_blank"><i class="icon-twitter icon-large"></i> Follow @fortaweso_me</a>-->
|
||||
<!--<span id="followers" class="count btn btn-mini">2500+</span>-->
|
||||
<!--</div>-->
|
||||
</div>
|
||||
</div>
|
||||
30
build/_includes/whats-new.html
Normal file
30
build/_includes/whats-new.html
Normal file
@ -0,0 +1,30 @@
|
||||
<section id="whats-new">
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<h4><i class="icon-magic"></i> Pixel Perfection at 14px</h4>
|
||||
Every single icon re-created from the ground up to be optimized for Bootstrap's default 14px.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-th-large"></i> <a target="_blank" href="http://icnfnt.com/">Font Sub-setting</a></h4>
|
||||
Thanks to <a target="_blank" href="https://twitter.com/grantgordon">@grantgordon</a> and <a target="_blank" href="https://twitter.com/johnsmclay">@johnsmclay</a>, you can <a target="_blank" href="http://icnfnt.com/">subset</a> to get just the icons you need.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-legal"></i> <a href="#license">Better License</a></h4>
|
||||
SIL open font license, MIT license for code. No more attribution required, but much appreciated.
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<h4><i class="icon-lightbulb"></i> 40 New Icons in 3.0</h4>
|
||||
Requested by the active community on the <a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">Font Awesome GitHub project</a>.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-spinner icon-spin"></i> <a href="#examples">New Styles</a></h4>
|
||||
<a href="#examples">New styles</a> for animated spinning icons, icons with 2x-4x size multipliers, icon borders, & more.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-resize-small"></i> 28% Smaller Payload</h4>
|
||||
3.0 is smaller, even with 16% more icons. Crazy small if you <a target="_blank" href="http://icnfnt.com/">subset</a> just the icons you need.
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
44
build/_includes/why.html
Normal file
44
build/_includes/why.html
Normal file
@ -0,0 +1,44 @@
|
||||
<div id="why">
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<h4><i class="icon-flag"></i> One font, 249 icons</h4>
|
||||
In a single collection, Font Awesome is a pictographic language of web-related actions.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-pencil"></i> CSS control</h4>
|
||||
Easily style icon color, size, shadow, and anything that's possible with CSS.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-fullscreen"></i> Infinite scalability</h4>
|
||||
Scalable vector graphics means every icon looks awesome at any size.
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<h4><i class="icon-beer"></i> Free, as in Beer</h4>
|
||||
Font Awesome is completely free for commercial use. Check out the <a href="#license">license</a>.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-ok"></i> IE7 Support</h4>
|
||||
Font Awesome supports IE7. If you need it, you have my condolences.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-eye-open"></i> Perfect on Retina Displays</h4>
|
||||
Font Awesome icons are vectors, which mean they're gorgeous on high-resolution displays.
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="span4">
|
||||
<h4><i class="icon-thumbs-up"></i> Made for Bootstrap</h4>
|
||||
Designed from scratch to be fully compatible with <a href="{{ site.bootstrap.url }}" target="_blank">Bootstrap {{ site.bootstrap.version }}</a>.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-tint"></i> Designer Friendly</h4>
|
||||
Install FontAwesome.otf and <a href="design.html" target="_blank">visit the copy & paste page</a>. Happy designing.
|
||||
</div>
|
||||
<div class="span4">
|
||||
<h4><i class="icon-search"></i> Screen reader compatible</h4>
|
||||
Font Awesome won't trip up screen readers, unlike other icon fonts.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
65
build/_layouts/base.html
Normal file
65
build/_layouts/base.html
Normal file
@ -0,0 +1,65 @@
|
||||
<!DOCTYPE html>
|
||||
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
|
||||
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
|
||||
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
|
||||
<!--[if (gte IE 9)|!(IE)]><!-->
|
||||
<html lang="en" xmlns="http://www.w3.org/1999/html"> <!--<![endif]-->
|
||||
<head>
|
||||
<!-- Basic Page Needs
|
||||
================================================== -->
|
||||
<meta charset="utf-8" />
|
||||
<title>{% if page.title %}{{ page.title }}{% endif %}</title>
|
||||
<meta name="description" content="Font Awesome, the iconic font designed for use with Bootstrap">
|
||||
<meta name="author" content="Dave Gandy">
|
||||
<!--<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">-->
|
||||
|
||||
<!--[if lt IE 9]>
|
||||
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<!-- CSS
|
||||
================================================== -->
|
||||
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}assets/css/site.css">
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}assets/css/prettify.css">
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}assets/css/font-awesome.css">
|
||||
<!--[if IE 7]>
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}assets/css/font-awesome-ie7.css">
|
||||
<![endif]-->
|
||||
<!-- Le fav and touch icons -->
|
||||
<link rel="shortcut icon" href="{{ site.baseurl }}assets/ico/favicon.ico">
|
||||
|
||||
<script type="text/javascript" src="//use.typekit.net/wnc7ioh.js"></script>
|
||||
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', 'UA-30136587-1']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(function() {
|
||||
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
||||
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
||||
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
<body data-spy="scroll" data-target=".navbar">
|
||||
<div class="wrapper"> <!-- necessary for sticky footer. wrap all content except footer -->
|
||||
{% include navbar.html %}
|
||||
|
||||
{{ content }}
|
||||
<div class="push"><!-- necessary for sticky footer --></div>
|
||||
</div>
|
||||
{% include footer.html %}
|
||||
|
||||
<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
|
||||
<script src="{{ site.baseurl }}assets/js/jquery-1.7.1.min.js"></script>
|
||||
<script src="{{ site.baseurl }}assets/js/underscore.min.js"></script>
|
||||
<script src="{{ site.baseurl }}assets/js/backbone.min.js"></script>
|
||||
<script src="{{ site.baseurl }}assets/js/prettify.min.js"></script>
|
||||
<script src="{{ site.baseurl }}assets/js/bootstrap-222.min.js"></script>
|
||||
<script src="{{ site.baseurl }}assets/js/index/index.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
39
build/_layouts/icon.html
Executable file
39
build/_layouts/icon.html
Executable file
@ -0,0 +1,39 @@
|
||||
---
|
||||
layout: base
|
||||
title_prefix: Font Awesome Icons
|
||||
---
|
||||
<div class="container">
|
||||
<section>
|
||||
<dl class="dl-horizontal">
|
||||
<dt>Icon</dt>
|
||||
<dd><i class="icon-{{ page.icon['id'] }}"></i></dd>
|
||||
|
||||
<dt>Icon Class</dt>
|
||||
<dd>icon-{{ page.icon['id'] }}</dd>
|
||||
|
||||
<dt>Unicode</dt>
|
||||
<dd>{{ page.icon['unicode'] }}</dd>
|
||||
|
||||
<dt>Created</dt>
|
||||
<dd>v{{ page.icon['created'] }}</dd>
|
||||
|
||||
{% if page.icon['categories'] %}
|
||||
<dt>Categories</dt>
|
||||
<dd>
|
||||
{% for category in page.icon['categories'] %}
|
||||
{{ category }}<br>
|
||||
{% endfor %}
|
||||
</dd>
|
||||
{% endif %}
|
||||
|
||||
{% if page.icon['aliases'] %}
|
||||
<dt>Aliases</dt>
|
||||
<dd>
|
||||
{% for alias in page.icon['aliases'] %}
|
||||
{{ alias }}<br>
|
||||
{% endfor %}
|
||||
</dd>
|
||||
{% endif %}
|
||||
</dl>
|
||||
</section>
|
||||
</div>
|
||||
48
build/_plugins/icon_page_generator.rb
Executable file
48
build/_plugins/icon_page_generator.rb
Executable file
@ -0,0 +1,48 @@
|
||||
##
|
||||
# Create individual pages for each icon in the FontAwesome set
|
||||
|
||||
require 'yaml'
|
||||
|
||||
module Jekyll
|
||||
|
||||
class IconPage < Page
|
||||
|
||||
##
|
||||
# Take a single icon and render a page for it.
|
||||
|
||||
def initialize(site, base, dir, icon)
|
||||
@site = site
|
||||
@base = base
|
||||
@dir = dir
|
||||
@name = "#{icon['id']}/index.html"
|
||||
@icon = icon
|
||||
|
||||
self.process(@name)
|
||||
|
||||
self.read_yaml(File.join(base, site.config['layouts']), site.config['icon_layout'])
|
||||
|
||||
self.data['icon'] = icon
|
||||
self.data['title'] = self.data['title_prefix'] + " — #{icon['name']}"
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
class IconGenerator < Generator
|
||||
|
||||
##
|
||||
# Iterate over every described icon in a YAML file and create a page for it
|
||||
|
||||
safe true
|
||||
|
||||
def generate(site)
|
||||
icon_meta_filename = site.config['icon_meta']
|
||||
icon_meta = YAML.load_file(icon_meta_filename)
|
||||
|
||||
icon_meta['icons'].each do |icon|
|
||||
site.pages << IconPage.new(site, site.source, site.config['icon_destination'], icon)
|
||||
end
|
||||
end
|
||||
|
||||
end
|
||||
|
||||
end
|
||||
@ -1128,3 +1128,9 @@ ul.icons li [class*=" icon-"] {
|
||||
.icon-calendar-empty:before {
|
||||
content: "\f133";
|
||||
}
|
||||
.icon-fire-extinguisher:before {
|
||||
content: "\f134";
|
||||
}
|
||||
.icon-rocket:before {
|
||||
content: "\f135";
|
||||
}
|
||||
@ -5253,14 +5253,30 @@ a.badge:focus {
|
||||
.affix {
|
||||
position: fixed;
|
||||
}
|
||||
.text-align-right {
|
||||
text-align: right;
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
.text-align-center {
|
||||
text-align: center;
|
||||
.wrapper {
|
||||
min-height: 100%;
|
||||
height: auto !important;
|
||||
height: 100%;
|
||||
}
|
||||
.footer {
|
||||
min-width: 990px;
|
||||
}
|
||||
.wrapper {
|
||||
margin: 0 auto -191px;
|
||||
}
|
||||
.push {
|
||||
height: 191px;
|
||||
}
|
||||
.footer {
|
||||
margin-top: 40px;
|
||||
height: 90px;
|
||||
padding: 30px 0 30px;
|
||||
}
|
||||
.navbar .brand {
|
||||
color: #ffffff;
|
||||
font-family: museo-slab, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
}
|
||||
.navbar .brand .icon-flag {
|
||||
@ -5302,7 +5318,7 @@ h6 {
|
||||
.jumbotron {
|
||||
background: #9d261d;
|
||||
border-bottom: 1px solid #721c15;
|
||||
padding: 90px 0 48px;
|
||||
padding: 48px 0;
|
||||
text-shadow: 2px 2px 2px #333333;
|
||||
}
|
||||
.jumbotron,
|
||||
@ -5316,10 +5332,13 @@ h6 {
|
||||
}
|
||||
.jumbotron p {
|
||||
margin-top: 15px;
|
||||
margin-bottom: 30px;
|
||||
margin-bottom: 15px;
|
||||
font-size: 30px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.jumbotron .actions {
|
||||
margin-top: 30px;
|
||||
}
|
||||
.jumbotron ul {
|
||||
margin-left: 50px;
|
||||
}
|
||||
@ -5349,6 +5368,15 @@ h6 {
|
||||
color: #ce938e;
|
||||
text-shadow: none;
|
||||
}
|
||||
.jumbotron-ad {
|
||||
padding: 20px 0;
|
||||
}
|
||||
.jumbotron-ad h1 {
|
||||
margin-top: 25px;
|
||||
}
|
||||
.jumbotron-ad p {
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
.btn-github {
|
||||
color: #ffffff;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
||||
@ -5395,12 +5423,15 @@ section {
|
||||
padding-top: 40px;
|
||||
}
|
||||
#social-buttons {
|
||||
padding: 22px 0;
|
||||
padding: 22px 0 17px;
|
||||
text-align: center;
|
||||
background-color: #f5f5f5;
|
||||
border-top: 1px solid #fff;
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
#social-buttons ul.unstyled {
|
||||
margin: 0;
|
||||
}
|
||||
#social-buttons .btn {
|
||||
font-weight: bold;
|
||||
padding: 0px 5px;
|
||||
@ -5414,11 +5445,16 @@ section {
|
||||
#social-buttons .fork {
|
||||
margin-right: 30px;
|
||||
}
|
||||
.carbonad-horizontal {
|
||||
width: 310px;
|
||||
margin: 20px auto 10px;
|
||||
}
|
||||
.the-icons {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
}
|
||||
.the-icons li {
|
||||
.the-icons li a {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
@ -5427,21 +5463,26 @@ section {
|
||||
-moz-border-radius: 6px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.the-icons li [class^="icon-"],
|
||||
.the-icons li [class*=" icon-"] {
|
||||
.the-icons li a,
|
||||
.the-icons li a:hover {
|
||||
color: #222222;
|
||||
}
|
||||
.the-icons li a [class^="icon-"],
|
||||
.the-icons li a [class*=" icon-"] {
|
||||
width: 32px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.the-icons li:hover {
|
||||
.the-icons li a:hover {
|
||||
text-decoration: none;
|
||||
background-color: #fbf4f4;
|
||||
}
|
||||
.the-icons li:hover [class^="icon-"],
|
||||
.the-icons li:hover [class*=" icon-"] {
|
||||
.the-icons li a:hover [class^="icon-"],
|
||||
.the-icons li a:hover [class*=" icon-"] {
|
||||
*font-size: 28px;
|
||||
*vertical-align: middle;
|
||||
}
|
||||
.the-icons li:hover [class^="icon-"]:before,
|
||||
.the-icons li:hover [class*=" icon-"]:before {
|
||||
.the-icons li a:hover [class^="icon-"]:before,
|
||||
.the-icons li a:hover [class*=" icon-"]:before {
|
||||
font-size: 28px;
|
||||
vertical-align: -5px;
|
||||
}
|
||||
@ -5659,3 +5700,6 @@ footer a:hover {
|
||||
footer ul {
|
||||
line-height: 25px;
|
||||
}
|
||||
footer .project {
|
||||
margin-top: 10px;
|
||||
}
|
||||
BIN
build/assets/font/FontAwesome.otf
Normal file
BIN
build/assets/font/FontAwesome.otf
Normal file
Binary file not shown.
|
Before Width: | Height: | Size: 135 KiB After Width: | Height: | Size: 135 KiB |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 2.4 KiB After Width: | Height: | Size: 2.4 KiB |
|
Before Width: | Height: | Size: 112 KiB After Width: | Height: | Size: 112 KiB |
|
Before Width: | Height: | Size: 8.6 KiB After Width: | Height: | Size: 8.6 KiB |
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
27
build/assets/js/index/index.js
Normal file
27
build/assets/js/index/index.js
Normal file
@ -0,0 +1,27 @@
|
||||
$(function() {
|
||||
// start the icon carousel
|
||||
$('#iconCarousel').carousel({
|
||||
interval: 5000
|
||||
});
|
||||
|
||||
// make code pretty
|
||||
window.prettyPrint && prettyPrint();
|
||||
|
||||
// inject twitter & github counts
|
||||
$.ajax({
|
||||
url: 'http://api.twitter.com/1/users/show.json',
|
||||
data: {screen_name: 'fortaweso_me'},
|
||||
dataType: 'jsonp',
|
||||
success: function(data) {
|
||||
$('#followers').html(data.followers_count);
|
||||
}
|
||||
});
|
||||
$.ajax({
|
||||
url: 'https://api.github.com/repos/fortawesome/Font-Awesome',
|
||||
dataType: 'jsonp',
|
||||
success: function(data) {
|
||||
$('#watchers').html(data.data.watchers);
|
||||
$('#forks').html(data.data.forks);
|
||||
}
|
||||
});
|
||||
});
|
||||
@ -570,3 +570,5 @@ ul.icons {
|
||||
.icon-microphone-off:before { content: "\f131"; }
|
||||
.icon-shield:before { content: "\f132"; }
|
||||
.icon-calendar-empty:before { content: "\f133"; }
|
||||
.icon-fire-extinguisher:before { content: "\f134"; }
|
||||
.icon-rocket:before { content: "\f135"; }
|
||||
@ -40,4 +40,19 @@
|
||||
line-height: @size * 1.1;
|
||||
height: @size * @height-multiplier * 1.05;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.sticky-footer (@footer-height: @baseLineHeight * 4, @footer-padding-top: 70px, @footer-padding-bottom: 70px, @footer-margin-top: 70px) {
|
||||
.wrapper {
|
||||
margin: 0 auto -(@footer-height + @footer-padding-bottom + @footer-padding-top + @footer-margin-top + 1);
|
||||
}
|
||||
.push {
|
||||
height: @footer-height + @footer-padding-bottom + @footer-padding-top + @footer-margin-top + 1;
|
||||
}
|
||||
|
||||
.footer {
|
||||
margin-top: @footer-margin-top;
|
||||
height: @footer-height;
|
||||
padding: @footer-padding-top 0 @footer-padding-bottom;
|
||||
}
|
||||
}
|
||||
@ -1,14 +1,12 @@
|
||||
@import "twbs-2.3.1/bootstrap.less";
|
||||
@import "sticky-footer.less";
|
||||
|
||||
@import "mixins.less";
|
||||
@import "variables.less";
|
||||
|
||||
.text-align-right { text-align: right; }
|
||||
.text-align-center { text-align: center; }
|
||||
|
||||
.navbar .brand {
|
||||
// padding: 11px 20px 9px;
|
||||
color: @white;
|
||||
// color: @white;
|
||||
font-family: @serifFontFamily;
|
||||
.icon-flag { padding-right: 3px; }
|
||||
}
|
||||
@ -39,21 +37,10 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//a[href^='http://'] {
|
||||
// &:after {
|
||||
// font-family: FontAwesome;
|
||||
// content: "\0020 \f08e";
|
||||
// &:hover {
|
||||
// text-decoration: none;
|
||||
// }
|
||||
// }
|
||||
//}
|
||||
|
||||
.jumbotron {
|
||||
background: @red;
|
||||
border-bottom: 1px solid @redDark;
|
||||
padding: 90px 0 48px;
|
||||
padding: 48px 0;
|
||||
// #gradient > .radial( lighten(@red, 10%), @red);
|
||||
// background-color: @red;
|
||||
&, h1 { color: @white; }
|
||||
@ -77,10 +64,11 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
|
||||
}
|
||||
p {
|
||||
margin-top: 15px;
|
||||
margin-bottom: 30px;
|
||||
margin-bottom: 15px;
|
||||
font-size: 30px;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.actions { margin-top: 30px;}
|
||||
text-shadow: 2px 2px 2px @grayDark;
|
||||
ul {
|
||||
margin-left: 50px;
|
||||
@ -127,6 +115,12 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
|
||||
}
|
||||
}
|
||||
|
||||
.jumbotron-ad {
|
||||
padding: 20px 0;
|
||||
h1 { margin-top: 25px; }
|
||||
p { margin-bottom: 35px; }
|
||||
}
|
||||
|
||||
.btn-github {
|
||||
.buttonBackground(@white, mix(@grayLighter, @grayLight, 50%));
|
||||
}
|
||||
@ -145,7 +139,9 @@ section {
|
||||
}
|
||||
|
||||
#social-buttons {
|
||||
padding: 22px 0;
|
||||
ul.unstyled { margin: 0; }
|
||||
|
||||
padding: 22px 0 17px;
|
||||
text-align: center;
|
||||
background-color: #f5f5f5;
|
||||
border-top: 1px solid #fff;
|
||||
@ -166,39 +162,49 @@ section {
|
||||
}
|
||||
}
|
||||
|
||||
.carbonad-horizontal {
|
||||
width: 310px;
|
||||
margin: 20px auto 10px;
|
||||
}
|
||||
|
||||
.the-icons {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
li {
|
||||
cursor: pointer;
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
padding-left: 12px;
|
||||
.border-radius(6px);
|
||||
// vertical-align: middle;
|
||||
a {
|
||||
display: block;
|
||||
&, &:hover { color: @grayDarker; }
|
||||
|
||||
[class^="icon-"],
|
||||
[class*=" icon-"] {
|
||||
width: 32px;
|
||||
font-size: 14px;
|
||||
}
|
||||
&:hover {
|
||||
background-color: lighten(@errorBackground, 6%);
|
||||
[class^="icon-"], [class*=" icon-"] {
|
||||
*font-size: 28px;
|
||||
*vertical-align: middle;
|
||||
cursor: pointer;
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
padding-left: 12px;
|
||||
.border-radius(6px);
|
||||
|
||||
[class^="icon-"],
|
||||
[class*=" icon-"] {
|
||||
width: 32px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
[class^="icon-"]:before,
|
||||
[class*=" icon-"]:before {
|
||||
font-size: 28px;
|
||||
vertical-align: -5px;
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
background-color: lighten(@errorBackground, 6%);
|
||||
[class^="icon-"], [class*=" icon-"] {
|
||||
*font-size: 28px;
|
||||
*vertical-align: middle;
|
||||
}
|
||||
|
||||
[class^="icon-"]:before,
|
||||
[class*=" icon-"]:before {
|
||||
font-size: 28px;
|
||||
vertical-align: -5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#why, #whats-new {
|
||||
.row {
|
||||
margin-bottom: 20px;
|
||||
@ -370,4 +376,6 @@ footer {
|
||||
// margin-left: 30px;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.project { margin-top: 10px; }
|
||||
}
|
||||
27
build/assets/less/sticky-footer.less
Executable file
27
build/assets/less/sticky-footer.less
Executable file
@ -0,0 +1,27 @@
|
||||
//
|
||||
// Sticky Footer
|
||||
// --------------------------------------------------
|
||||
// make sure to set .sticky-footer()
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
.wrapper {
|
||||
min-height: 100%;
|
||||
height: auto !important;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.footer {
|
||||
min-width: 990px; // necessary fix for non-responsive layouts
|
||||
// border-top: 1px solid @grayLighter;
|
||||
// background-color: #f5f5f5;
|
||||
|
||||
// color: #777;
|
||||
|
||||
// p {
|
||||
// margin-bottom: 0;
|
||||
// }
|
||||
}
|
||||
|
||||
.sticky-footer(90px, 30px, 30px, 40px); // sets default values for sticky footer
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user