Commit 8b5f31b8 authored by Huang's avatar Huang
Browse files

no commit message

parent d8b3ed74
<section id="file-type">
<h2 class="page-header">File Type Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_file_type = icons | expand_aliases | category:"File Type Icons" | sort_by:'class' %}
{% for icon in icons_file_type %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="form-control">
<h2 class="page-header">Form Control Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_form_control = icons | expand_aliases | category:"Form Control Icons" | sort_by:'class' %}
{% for icon in icons_form_control %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="gender">
<h2 class="page-header">Gender Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_gender = icons | expand_aliases | category:"Gender Icons" | sort_by:'class' %}
{% for icon in icons_gender %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="hand">
<h2 class="page-header">Hand Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_hand = icons | expand_aliases | category:"Hand Icons" | sort_by:'class' %}
{% for icon in icons_hand %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="medical">
<h2 class="page-header">Medical Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_medical = icons | expand_aliases | category:"Medical Icons" | sort_by:'class' %}
{% for icon in icons_medical %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="new">
<h2 class="page-header">{{ icons | version:site.fontawesome.minor_version | size }} New Icons in {{ site.fontawesome.minor_version }}</h2>
{% if page.navbar_active != "icons" %}
<div class="margin-botom-large">
You asked, Font Awesome delivers with {{ icons | version:site.fontawesome.minor_version | size }} shiny new icons in version {{ site.fontawesome.minor_version }}.
Want to request new icons? <a href="{{ page.relative_path }}community/#requesting-new-icons">Here's how</a>.
</div>
{% endif %}
<div class="row fontawesome-icon-list">
{% assign icons_new = icons | expand_aliases | version:site.fontawesome.minor_version | sort_by:'class' %}
{% for icon in icons_new %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="payment">
<h2 class="page-header">Payment Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_payment = icons | expand_aliases | category:"Payment Icons" | sort_by:'class' %}
{% for icon in icons_payment %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="spinner">
<h2 class="page-header">Spinner Icons</h2>
<div class="alert alert-success">
<ul class="fa-ul">
<li>
<i class="fa fa-info-circle fa-lg fa-li"></i>
These icons work great with the <code>fa-spin</code> class. Check out the
<a href="{{ page.relative_path }}examples/#animated" class="alert-link">spinning icons example</a>.
</li>
</ul>
</div>
<div class="row fontawesome-icon-list">
{% assign icons_spinner = icons | expand_aliases | category:"Spinner Icons" | sort_by:'class' %}
{% for icon in icons_spinner %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="text-editor">
<h2 class="page-header">Text Editor Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_text_editor = icons | expand_aliases | category:"Text Editor Icons" | sort_by:'class' %}
{% for icon in icons_text_editor %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="transportation">
<h2 class="page-header">Transportation Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_transportation = icons | expand_aliases | category:"Transportation Icons" | sort_by:'class' %}
{% for icon in icons_transportation %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="video-player">
<h2 class="page-header">Video Player Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_video_player = icons | expand_aliases | category:"Video Player Icons" | sort_by:'class' %}
{% for icon in icons_video_player %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<section id="web-application">
<h2 class="page-header">Web Application Icons</h2>
<div class="row fontawesome-icon-list">
{% assign icons_web_application = icons | expand_aliases | category:"Web Application Icons" | sort_by:'class' %}
{% for icon in icons_web_application %}
<div class="fa-hover col-md-3 col-sm-4"><a href="{{ page.relative_path }}icon/{{ icon.id }}"><i class="fa fa-{{ icon.class }}"></i> {{ icon.class }}{% if icon.alias_of %} <span class="text-muted">(alias)</span>{% endif %}</a></div>
{% endfor %}
</div>
</section>
<div class="jumbotron jumbotron-carousel hidden-print">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-8 text-center">
<h1>Font Awesome</h1>
<p>The iconic font and CSS toolkit</p>
<div class="actions">
<a class="btn btn-default btn-lg" href="#modal-download" data-toggle="modal"
onClick="_gaq.push(['_trackEvent', 'Launch Modal', 'Launch Download Modal']);">
<i class="fa fa-download fa-lg"></i>&nbsp;
Download
</a>
</div>
<div class="shameless-self-promotion">
Version {{ site.fontawesome.version }} &nbsp;&nbsp;&middot;&nbsp;&nbsp;
<a href="{{ site.fontawesome.github.url }}"
onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'View Project on GitHub']);">
GitHub Project</a> &nbsp;&nbsp;&middot;&nbsp;&nbsp;
<a href="{{ page.relative_path }}3.2.1">Old 3.2.1 Docs</a> &nbsp;&nbsp;&middot;&nbsp;&nbsp;
Created by <a href="http://twitter.com/{{ site.fontawesome.author.twitter }}">Dave Gandy</a>
</div>
</div>
<div class="col-md-4 col-sm-4">
<div id="icon-carousel" class="carousel slide">
<!-- Carousel items -->
<div class="carousel-inner">
<div class="active item"><div><i class="fa fa-flag"></i></div></div>
<div class="item"><div><i class="fa fa-hand-spock-o"></i></div></div>
<div class="item"><div><i class="fa fa-sticky-note"></i></div></div>
<div class="item"><div><i class="fa fa-commenting"></i></div></div>
<div class="item"><div><i class="fa fa-map-signs"></i></div></div>
<div class="item"><div><i class="fa fa-envelope"></i></div></div>
<div class="item"><div><i class="fa fa-send-o"></i></div></div>
<div class="item"><div><i class="fa fa-book"></i></div></div>
<div class="item"><div><i class="fa fa-fighter-jet"></i></div></div>
<div class="item"><div><i class="fa fa-beer"></i></div></div>
<div class="item"><div><i class="fa fa-heart-o"></i></div></div>
<div class="item"><div><i class="fa fa-thumbs-o-up"></i></div></div>
<div class="item"><div><i class="fa fa-pied-piper-alt"></i></div></div>
</div>
<!-- Carousel nav -->
<a class="carousel-control left" href="#icon-carousel" data-slide="prev"
onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Prev']);">
<i class="fa fa-arrow-circle-left"></i></a>
<a class="carousel-control right" href="#icon-carousel" data-slide="next"
onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Next']);">
<i class="fa fa-arrow-circle-right"></i></a>
</div>
</div>
</div>
</div>
</div>
<div class="jumbotron jumbotron-ad hidden-print">
<div class="container">
<h1>{{ jumbotron_h1 }}</h1>
<p>{{ jumbotron_p }}</p>
</div>
</div>
<div class="modal fade" id="modal-download" tabindex="-1" role="dialog" aria-labelledby="modal-download-label">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times"></i></button>
<h2 class="modal-title" id="modal-download-label">Help Us Out!</h2>
</div>
<div class="modal-body text-lg">
<p class="margin-bottom-lg">
I hope you love Font Awesome. If you've found it useful,
<a class="strong" href="https://fonticons.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_content=download_modal&utm_campaign=promo_4.4_update" target="_blank">
please do me a favor and check out my latest project, Fonticons</a>. It makes it easy to put the perfect
icons on your website. Choose from our awesome, comprehensive icon sets or copy and paste your own.
</p>
<p class="margin-bottom-lg">
Please. Check it out.
</p>
<p>&mdash;Dave Gandy</p>
</div>
<div class="modal-footer">
<a class="btn btn-default btn-lg block-xs" href="{{ page.relative_path }}assets/font-awesome-{{ site.fontawesome.version }}.zip"
onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Download on GitHub']);">
<i class="fa fa-download fa-lg"></i>&nbsp;
Download
</a>
<a class="btn btn-success btn-lg block-xs" href="https://fonticons.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_content=download_modal&utm_campaign=promo_4.4_update" target="_blank">
Check out Fonticons &nbsp;<i class="fa fa-external-link fa-lg"></i>
</a>
</div>
</div>
</div>
</div>
<div class="collapse hidden-print" id="banner">
<div class="container">
<div class="message-container">
<div class="tagline">
<span id="rotating-message"></span>
</div>
<div class="action">
<a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
</div>
</div>
</div>
</div>
<div class="navbar navbar-inverse navbar-static-top hidden-print">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<i class="fa fa-bars fa-lg"></i>
</button>
<a class="navbar-brand" href="{{ page.relative_path }}"><i class="fas fas-logo"></i></a>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="hidden-sm {% if page.navbar_active == "home" %} active{% endif %}"><a href="{{ page.relative_path }}">Home</a></li>
<li class="hidden-sm{% if page.navbar_active == "whats-new" %} active{% endif %}">
<a href="{{ page.relative_path }}whats-new/">What's New</a>
</li>
<li class="hidden-xs hidden-md hidden-lg{% if page.navbar_active == "whats-new" %} active{% endif %}">
<a href="{{ page.relative_path }}whats-new/">New</a>
</li>
<li{% if page.navbar_active == "get-started" %} class="active"{% endif %}><a href="{{ page.relative_path }}get-started/">Get Started</a></li>
<li class="dropdown-split-left{% if page.navbar_active == "icons" %} active{% endif %}"><a href="{{ page.relative_path }}icons/">Icons</a></li>
<li class="dropdown dropdown-split-right hidden-xs{% if page.navbar_active == "icons" %} active{% endif %}">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu pull-right">
<li><a href="{{ page.relative_path }}icons/"><i class="fa fa-flag fa-fw"></i>&nbsp; All Icons</a></li>
<li class="divider"></li>
<li><a href="{{ page.relative_path }}icons/#new"><i class="fa fa-diamond fa-fw"></i>&nbsp; New Icons in {{ site.fontawesome.minor_version }}</a></li>
<li><a href="{{ page.relative_path }}icons/#web-application"><i class="fa fa-camera-retro fa-fw"></i>&nbsp; Web Application Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#hand"><i class="fa fa-hand-spock-o fa-fw"></i>&nbsp; Hand Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#transportation"><i class="fa fa-ship fa-fw"></i>&nbsp; Transportation Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#gender"><i class="fa fa-venus fa-fw"></i>&nbsp; Gender Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#file-type"><i class="fa fa-file-image-o fa-fw"></i>&nbsp; File Type Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#spinner"><i class="fa fa-spinner fa-fw"></i>&nbsp; Spinner Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#form-control"><i class="fa fa-check-square fa-fw"></i>&nbsp; Form Control Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#payment"><i class="fa fa-credit-card fa-fw"></i>&nbsp; Payment Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#chart"><i class="fa fa-pie-chart fa-fw"></i>&nbsp; Chart Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#currency"><i class="fa fa-won fa-fw"></i>&nbsp; Currency Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#text-editor"><i class="fa fa-file-text-o fa-fw"></i>&nbsp; Text Editor Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#directional"><i class="fa fa-arrow-right fa-fw"></i>&nbsp; Directional Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#video-player"><i class="fa fa-play-circle fa-fw"></i>&nbsp; Video Player Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#brand"><i class="fa fa-github fa-fw"></i>&nbsp; Brand Icons</a></li>
<li><a href="{{ page.relative_path }}icons/#medical"><i class="fa fa-medkit fa-fw"></i>&nbsp; Medical Icons</a></li>
</ul>
</li>
<li class="dropdown-split-left{% if page.navbar_active == "examples" %} active{% endif %}"><a href="{{ page.relative_path }}examples/">Examples</a></li>
<li class="dropdown dropdown-split-right hidden-xs{% if page.navbar_active == "examples" %} active{% endif %}">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-caret-down"></i>
</a>
<ul class="dropdown-menu pull-right">
<li><a href="{{ page.relative_path }}examples/">Examples</a></li>
<li class="divider"></li>
<li><a href="{{ page.relative_path }}examples/#basic">Basic Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#larger">Larger Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#fixed-width">Fixed Width Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#list">List Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#bordered-pulled">Bordered & Pulled Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#animated">Animated Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#rotated-flipped">Rotated &amp; Flipped Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#stacked">Stacked Icons</a></li>
<li><a href="{{ page.relative_path }}examples/#bootstrap">Bootstrap 3 Examples</a></li>
<li><a href="{{ page.relative_path }}examples/#custom">Custom CSS</a></li>
</ul>
</li>
<li{% if page.navbar_active == "community" %} class="active"{% endif %}><a href="{{ page.relative_path }}community/">Community</a></li>
<li{% if page.navbar_active == "license" %} class="active"{% endif %}><a href="{{ page.relative_path }}license/">License</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="{{ site.fontawesome.blog_url }}">Blog</a></li>
</ul>
</div>
</div>
</div>
<section id="whats-new" class="feature-list">
<div class="row">
<div class="col-md-4 col-sm-6">
<h4><i class="fa fa-file-text-o"></i> Completely Rewritten</h4>
Everything re-written from the ground up for speed and simplicity.
</div>
<div class="col-md-4 col-sm-6">
<h4><i class="fa fa-fighter-jet"></i> CSS Best Practices</h4>
New icon base class allows simpler CSS, faster rendering, and easier control.
</div>
<div class="col-md-4 col-sm-6">
<h4><i class="fa fa-terminal"></i> New Icon Names</h4>
Icons have been renamed to improve consistency and predictability.
</div>
<div class="col-md-4 col-sm-6">
<h4><i class="fa fa-thumbs-o-up"></i> Bootstrap 3</h4>
Font Awesome {{ site.fontawesome.minor_version }} is fully tested and compatible with Bootstrap 3.
</div>
<div class="col-md-4 col-sm-6">
<h4><i class="fa fa-code"></i> Better Compatibility</h4>
Font Awesome is now more compatible with all web frameworks, including Foundation.
</div>
<div class="col-md-4 col-sm-6">
<h4><i class="fa fa-rub"></i> {{ icons | version:site.fontawesome.minor_version | size }} New Icons in {{ site.fontawesome.minor_version }}</h4>
Requested by the active community on the <a href="{{ site.fontawesome.github.url }}">Font Awesome GitHub project</a>.
</div>
</div>
</section>
<section id="new-naming">
<h2 class="page-header">New Naming Conventions in {{ site.fontawesome.minor_version }}</h2>
<p class="lead text-center alert alert-success">fa-[name]-[shape]-[o]-[direction]</p>
<p>
A desire for better icon naming <strong>consistency</strong> and <strong>predictability</strong> are at the heart
of the changes in naming conventions. Once you know the name of the base icon shape, you should be able to predict
the names of variants.
</p>
<div class="row">
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">fa-*</h4>
<p class="margin-bottom-sm">Solid icons as the base variant</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-bookmark fa-li"></i>
fa-bookmark
</li>
<li>
<i class="fa fa-comment fa-li"></i>
fa-comment
</li>
<li>
<i class="fa fa-folder fa-li"></i>
fa-folder
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">*-o</h4>
<p class="margin-bottom-sm">Outlined version of previous modifier</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-bookmark-o fa-li"></i>
fa-bookmark-o
</li>
<li>
<i class="fa fa-comment-o fa-li"></i>
fa-comment-o
</li>
<li>
<i class="fa fa-folder-o fa-li"></i>
fa-folder-o
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">*-circle</h4>
<p class="margin-bottom-sm">Circle under previous modifier</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-check-circle fa-li"></i>
fa-check-circle
</li>
<li>
<i class="fa fa-exclamation-circle fa-li"></i>
fa-exclamation-circle
</li>
<li>
<i class="fa fa-plus-circle fa-li"></i>
fa-plus-circle
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">*-square</h4>
<p class="margin-bottom-sm">Square under previous modifier</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-check-square fa-li"></i>
fa-check-square
</li>
<li>
<i class="fa fa-twitter-square fa-li"></i>
fa-twitter-square
</li>
<li>
<i class="fa fa-plus-square fa-li"></i>
fa-plus-square
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">*-right, *-up, etc.</h4>
<p class="margin-bottom-sm">Directional modifier always at the end</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-arrow-right fa-li"></i>
fa-arrow-right
</li>
<li>
<i class="fa fa-arrow-circle-right fa-li"></i>
fa-arrow-circle-right
</li>
<li>
<i class="fa fa-angle-double-right fa-li"></i>
fa-angle-double-right
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">*-alt</h4>
<p class="margin-bottom-sm">Alternative to the original</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-unlock-alt fa-li"></i>
fa-unlock-alt
</li>
<li>
<i class="fa fa-list-alt fa-li"></i>
fa-list-alt
</li>
<li>
<i class="fa fa-github-alt fa-li"></i>
fa-github-alt
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">*-h, *-v</h4>
<p class="margin-bottom-sm">Horizontal &amp; vertical modifiers</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-arrows-v fa-li"></i>
fa-arrows-v
</li>
<li>
<i class="fa fa-arrows-h fa-li"></i>
fa-arrows-h
</li>
<li>
<i class="fa fa-ellipsis-v fa-li"></i>
fa-ellipsis-v
</li>
</ul>
</div>
<div class="col-lg-3 col-md-4 col-sm-6">
<h4 class="margin-bottom-sm">Combine 'em up...</h4>
<p class="margin-bottom-sm">Consistent when strung together</p>
<ul class="fa-ul padding-left-sm">
<li>
<i class="fa fa-arrow-circle-o-right fa-li"></i>
fa-arrow-circle-o-right
</li>
<li>
<i class="fa fa-caret-square-o-right fa-li"></i>
fa-caret-square-o-right
</li>
<li>
<i class="fa fa-hand-o-right fa-li"></i>
fa-hand-o-right
</li>
</ul>
</div>
</div>
</section>
<section id="new-upgrading">
<h2 class="page-header">Upgrading from 3.2.1?</h2>
<p>
For complete documentation of the syntax changes in {{ site.fontawesome.minor_version }}, check out the
<a href="{{ page.relative_path }}examples">examples</a>. For the changes to icon names,
<a href="https://twitter.com/gtagliala">@gtagliala</a> has put together a
<a href="{{ site.fontawesome.github.url }}/wiki/Upgrading-from-3.2.1-to-4">great wiki page</a> that
documents all the changes.
</p>
</section>
<section class="hidden-print">
<div class="stripe-ad">
{% include ads/fusion.html %}
{{ stripe_ad_content }}
</div>
</section>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment