1 files changed, 62 insertions, 0 deletions
diff --git a/library/font_awesome/src/_layouts/icon.html b/library/font_awesome/src/_layouts/icon.html
new file mode 100644
index 000000000..83723acde
--- /dev/null
+++ b/library/font_awesome/src/_layouts/icon.html
@@ -0,0 +1,62 @@
+---
+layout: base
+title_suffix: Font Awesome Icons
+relative_path: ../../
+---
+<div class="jumbotron jumbotron-icon">
+  <div class="container">
+    <div class="info-icons">
+      <i class="icon-{{ page.icon.id }} icon-6"></i>&nbsp;&nbsp;
+      <span class="hidden-phone">
+        <i class="icon-{{ page.icon.id }} icon-5"></i>&nbsp;&nbsp;
+        <span class="hidden-tablet"><i class="icon-{{ page.icon.id }} icon-4"></i>&nbsp;&nbsp;</span>
+        <i class="icon-{{ page.icon.id }} icon-3"></i>&nbsp;&nbsp;
+        <i class="icon-{{ page.icon.id }} icon-2"></i>&nbsp;
+      </span>
+      <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;
+        Unicode: <span class="upper">{{ page.icon.unicode }}</span> &middot;
+        Created: v{{ page.icon.created }} &middot;
+        Categories:
+        {% for category in page.icon.categories %}
+          {{ category }}{% unless forloop.last %},{% endunless %}
+        {% endfor %}
+        {% assign icon_alias_count = page.icon.aliases | size %}
+        {% if icon_alias_count > 0 %}
+          &middot; Aliases:
+          {% for alias in page.icon.aliases %}
+            icon-{{ alias }}{% unless forloop.last %},{% endunless %}
+          {% endfor %}
+        {% endif %}
+      </small>
+    </h1>
+  </div>
+</div>
+
+
+<div class="container">
+  <section>
+    <div class="row-fluid">
+      <div class="span9">
+        <p>After you get <a href="{{ page.relative_path }}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="{{ page.relative_path }}examples/">examples</a>.</div>
+      </div>
+      <div class="span3">
+        <div class="info-ad">{% include ads/carbon-light-vertical.html %}</div>
+      </div>
+    </div>
+  </section>
+</div>