Font-Awesome/build/_layouts/icon.html

59 lines
2.1 KiB
HTML
Raw Normal View History

---
layout: base
title_prefix: Font Awesome Icons
---
2013-05-03 03:16:41 +00:00
<div class="jumbotron jumbotron-icon">
<div class="container">
<div class="info-icons">
<i class="icon-{{ page.icon['id'] }} icon-6"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon['id'] }} icon-5"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon['id'] }} icon-4"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon['id'] }} icon-3"></i>&nbsp;&nbsp;
<i class="icon-{{ page.icon['id'] }} icon-2"></i>&nbsp;
2013-05-03 03:16:41 +00:00
<i class="icon-{{ page.icon['id'] }} icon-1"></i>
</div>
<h1 class="info-class">
icon-{{ page.icon['id'] }}
<small>
<i class="icon-{{ page.icon['id'] }}"></i> &middot;
2013-05-07 17:45:09 +00:00
Unicode: <span class="upper">{{ page.icon['unicode'] }}</span> &middot;
2013-05-03 03:16:41 +00:00
Created: v{{ page.icon['created'] }} &middot;
Categories:
{% for category in page.icon['categories'] %}
{{ category }}{% unless forloop.last %},{% endunless %}
{% endfor %}
{% if page.icon['aliases'] %}
2013-05-03 20:00:59 +00:00
&middot; Aliases:
2013-05-03 03:16:41 +00:00
{% for alias in page.icon['aliases'] %}
2013-05-03 20:00:59 +00:00
icon-{{ alias }}{% unless forloop.last %},{% endunless %}
2013-05-03 03:16:41 +00:00
{% endfor %}
{% endif %}
</small>
</h1>
</div>
</div>
<div class="container">
<section>
2013-05-03 03:16:41 +00:00
<div class="row-fluid">
<div class="span9">
<p>After you get <a href="{{ site.baseurl }}integration/">up and running</a>, you can place Font Awesome icons just about anywhere with the <code>&lt;i&gt;</code> tag:</p>
<div class="well well-transparent">
<div style="font-size: 24px; line-height: 1.5em;">
<i class="icon-{{ page.icon['id'] }}"></i> icon-{{ page.icon['id'] }}
</div>
</div>
{% highlight html %}
<i class="icon-{{ page.icon['id'] }}"></i> icon-{{ page.icon['id'] }}
{% endhighlight %}
<br>
<div class="lead"><i class="icon-info-sign"></i> Looking for more? Check out the <a href="{{ site.baseurl }}examples/">examples</a>.</div>
</div>
<div class="span3">
<div class="info-ad">{% include ads/carbon-light-vertical.html %}</div>
</div>
</div>
</section>
</div>