port to SCSS

This commit is contained in:
davegandy 2013-10-16 13:46:28 -04:00
parent 92c70bbcfe
commit 9bb033858c
20 changed files with 978 additions and 1553 deletions

Binary file not shown.

View file

@ -49,6 +49,7 @@
} }
} }
// allows usage of the hide class directly on font awesome icons // allows usage of the hide class directly on font awesome icons
.fa-icon.hide { display: none; } .fa-icon.hide { display: none; }
@ -66,6 +67,7 @@
border-radius: 3px; border-radius: 3px;
} }
// Icon Sizes // Icon Sizes
// ------------------------- // -------------------------
@ -90,7 +92,6 @@
border-radius: 6px; border-radius: 6px;
} }
} }
.fa-icon-5x { .fa-icon-5x {
font-size: 5em; font-size: 5em;
&.fa-icon-border { &.fa-icon-border {

View file

@ -1,113 +1,102 @@
/* FONT AWESOME CORE /* FONT AWESOME CORE
* -------------------------- */ * -------------------------- */
[class^="icon-"], .fa-icon {
[class*=" icon-"] {
@include icon-FontAwesome();
}
[class^="icon-"]:before,
[class*=" icon-"]:before {
display: inline-block; display: inline-block;
text-decoration: inherit; font-family: FontAwesome;
speak: none; font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
} }
/* makes the font 33% larger relative to the icon container */ /* makes the font 33% larger relative to the icon container */
.icon-large:before { .fa-icon-lg {
font-size: (4em/3); font-size: (4em / 3);
vertical-align: -10%; line-height: (3em / 4);
vertical-align: -15%;
} }
/* increased font size for icon-lg */
/* makes sure icons active on rollover in links */ .fa-icon-fixed-width {
a { width: (16em / 14);
[class^="icon-"], padding-right: (4em / 14);
[class*=" icon-"] { text-align: right;
display: inline; &.fa-icon-lg {
width: (20em / 14);
} }
} }
/* increased font size for icon-large */
[class^="icon-"],
[class*=" icon-"] {
&.icon-fixed-width {
display: inline-block;
width: (16em/14);
padding-right: (4em/14);
text-align: right;
&.icon-large {
width: (20em/14);
}
}
}
.icons-ul { // Icon UL & LI
// -------------------------
.fa-icon-ul {
padding-left: 0; padding-left: 0;
margin-left: $icons-li-width; margin-left: $fa-icon-li-width;
list-style-type: none; list-style-type: none;
> li { position: relative; } > li { position: relative; }
}
.icon-li { .fa-icon-li {
position: absolute; position: absolute;
left: -$icons-li-width; left: -$fa-icon-li-width;
width: $icons-li-width; width: $fa-icon-li-width;
line-height: inherit; top: (2em / 14);
text-align: center; text-align: center;
&.fa-icon-lg {
left: -$fa-icon-li-width + (4em / 14);
} }
} }
// allows usage of the hide class directly on font awesome icons // allows usage of the hide class directly on font awesome icons
[class^="icon-"], .fa-icon.hide { display: none; }
[class*=" icon-"] {
&.hide { .fa-icon-muted { color: $fa-icon-muted; }
display: none; .fa-icon-light { color: $fa-icon-light; }
} .fa-icon-dark { color: $fa-icon-dark; }
}
.icon-muted { color: $iconMuted; }
.icon-light { color: $iconLight; }
.icon-dark { color: $iconDark; }
// Icon Borders // Icon Borders
// ------------------------- // -------------------------
.icon-border { .fa-icon-border {
padding: .2em .25em .15em; padding: .2em .25em .15em;
border: solid 1px $borderColor; border: solid 1px $fa-border-color;
@include border-radius(3px); border-radius: 3px;
} }
// Icon Sizes // Icon Sizes
// ------------------------- // -------------------------
.icon-2x { .fa-icon-2x {
font-size: 2em; font-size: 2em;
&.icon-border { &.fa-icon-border {
border-width: 2px; border-width: 2px;
@include border-radius(4px); border-radius: 4px;
} }
} }
.icon-3x { .fa-icon-3x {
font-size: 3em; font-size: 3em;
&.icon-border { &.fa-icon-border {
border-width: 3px; border-width: 3px;
@include border-radius(5px); border-radius: 5px;
} }
} }
.icon-4x { .fa-icon-4x {
font-size: 4em; font-size: 4em;
&.icon-border { &.fa-icon-border {
border-width: 4px; border-width: 4px;
@include border-radius(6px); border-radius: 6px;
} }
} }
.fa-icon-5x {
.icon-5x {
font-size: 5em; font-size: 5em;
&.icon-border { &.fa-icon-border {
border-width: 5px; border-width: 5px;
@include border-radius(7px); border-radius: 7px;
} }
} }
@ -119,12 +108,7 @@ a {
.pull-right { float: right; } .pull-right { float: right; }
.pull-left { float: left; } .pull-left { float: left; }
[class^="icon-"], .fa-icon {
[class*=" icon-"] { &.pull-left { margin-right: .3em; }
&.pull-left { &.pull-right { margin-left: .3em; }
margin-right: .3em;
}
&.pull-right {
margin-left: .3em;
}
} }

View file

@ -2,24 +2,16 @@
* -------------------------- */ * -------------------------- */
/* Stacked and layered icon */ /* Stacked and layered icon */
@include icon-stack(); @include fa-icon-stack();
/* Animated rotating icon */ /* Animated rotating icon */
.icon-spin { .fa-icon-spin {
display: inline-block;
-webkit-animation: spin 2s infinite linear; -webkit-animation: spin 2s infinite linear;
-moz-animation: spin 2s infinite linear; -moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear; -o-animation: spin 2s infinite linear;
animation: spin 2s infinite linear; animation: spin 2s infinite linear;
} }
/* Prevent stack and spinners from being taken inline when inside a link */
a .icon-stack,
a .icon-spin {
display: inline-block;
text-decoration: none;
}
@-moz-keyframes spin { @-moz-keyframes spin {
0% { -moz-transform: rotate(0deg); } 0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(359deg); } 100% { -moz-transform: rotate(359deg); }
@ -41,53 +33,13 @@ a .icon-spin {
100% { transform: rotate(359deg); } 100% { transform: rotate(359deg); }
} }
/* Icon rotations and mirroring */
.icon-rotate-90:before {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
.icon-rotate-180:before { // Icon rotations & flipping
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); // -------------------------
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.icon-rotate-270:before { .fa-icon-rotate-90 { @include fa-icon-rotate(90deg, 1); }
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); .fa-icon-rotate-180 { @include fa-icon-rotate(180deg, 2); }
-webkit-transform: rotate(270deg); .fa-icon-rotate-270 { @include fa-icon-rotate(270deg, 3); }
-moz-transform: rotate(270deg);
-ms-transform: rotate(270deg);
-o-transform: rotate(270deg);
transform: rotate(270deg);
}
.icon-flip-horizontal:before { .fa-icon-flip-horizontal { @include fa-icon-flip(-1, 1); }
-webkit-transform: scale(-1, 1); .fa-icon-flip-vertical { @include fa-icon-flip(1, -1); }
-moz-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
transform: scale(-1, 1);
}
.icon-flip-vertical:before {
-webkit-transform: scale(1, -1);
-moz-transform: scale(1, -1);
-ms-transform: scale(1, -1);
-o-transform: scale(1, -1);
transform: scale(1, -1);
}
/* ensure rotation occurs inside anchor tags */
a {
.icon-rotate-90, .icon-rotate-180, .icon-rotate-270, .icon-flip-horizontal, .icon-flip-vertical {
&:before { display: inline-block; }
}
}

View file

@ -1,401 +1,401 @@
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
* readers do not read off random characters that represent icons */ readers do not read off random characters that represent icons */
.icon-glass:before { content: $glass; } .fa-icon-glass:before { content: $fa-icon-glass; }
.icon-music:before { content: $music; } .fa-icon-music:before { content: $fa-icon-music; }
.icon-search:before { content: $search; } .fa-icon-search:before { content: $fa-icon-search; }
.icon-envelope-alt:before { content: $envelope-alt; } .fa-icon-envelope-alt:before { content: $fa-icon-envelope-alt; }
.icon-heart:before { content: $heart; } .fa-icon-heart:before { content: $fa-icon-heart; }
.icon-star:before { content: $star; } .fa-icon-star:before { content: $fa-icon-star; }
.icon-star-alt:before { content: $star-alt; } .fa-icon-star-alt:before { content: $fa-icon-star-alt; }
.icon-user:before { content: $user; } .fa-icon-user:before { content: $fa-icon-user; }
.icon-film:before { content: $film; } .fa-icon-film:before { content: $fa-icon-film; }
.icon-th-large:before { content: $th-large; } .fa-icon-th-large:before { content: $fa-icon-th-large; }
.icon-th:before { content: $th; } .fa-icon-th:before { content: $fa-icon-th; }
.icon-th-list:before { content: $th-list; } .fa-icon-th-list:before { content: $fa-icon-th-list; }
.icon-check:before { content: $check; } .fa-icon-check:before { content: $fa-icon-check; }
.icon-times:before { content: $times; } .fa-icon-times:before { content: $fa-icon-times; }
.icon-zoom-in:before { content: $zoom-in; } .fa-icon-zoom-in:before { content: $fa-icon-zoom-in; }
.icon-zoom-out:before { content: $zoom-out; } .fa-icon-zoom-out:before { content: $fa-icon-zoom-out; }
.icon-power-off:before { content: $power-off; } .fa-icon-power-off:before { content: $fa-icon-power-off; }
.icon-signal:before { content: $signal; } .fa-icon-signal:before { content: $fa-icon-signal; }
.icon-gear:before, .fa-icon-gear:before,
.icon-cog:before { content: $cog; } .fa-icon-cog:before { content: $fa-icon-cog; }
.icon-trash:before { content: $trash; } .fa-icon-trash:before { content: $fa-icon-trash; }
.icon-home:before { content: $home; } .fa-icon-home:before { content: $fa-icon-home; }
.icon-file-alt:before { content: $file-alt; } .fa-icon-file-alt:before { content: $fa-icon-file-alt; }
.icon-time:before { content: $time; } .fa-icon-time:before { content: $fa-icon-time; }
.icon-road:before { content: $road; } .fa-icon-road:before { content: $fa-icon-road; }
.icon-download:before { content: $download; } .fa-icon-download:before { content: $fa-icon-download; }
.icon-arrow-circle-alt-down:before { content: $arrow-circle-alt-down; } .fa-icon-arrow-circle-alt-down:before { content: $fa-icon-arrow-circle-alt-down; }
.icon-arrow-circle-alt-up:before { content: $arrow-circle-alt-up; } .fa-icon-arrow-circle-alt-up:before { content: $fa-icon-arrow-circle-alt-up; }
.icon-inbox:before { content: $inbox; } .fa-icon-inbox:before { content: $fa-icon-inbox; }
.icon-play-circle-alt:before { content: $play-circle-alt; } .fa-icon-play-circle-alt:before { content: $fa-icon-play-circle-alt; }
.icon-rotate-right:before, .fa-icon-rotate-right:before,
.icon-repeat:before { content: $repeat; } .fa-icon-repeat:before { content: $fa-icon-repeat; }
.icon-refresh:before { content: $refresh; } .fa-icon-refresh:before { content: $fa-icon-refresh; }
.icon-list-alt:before { content: $list-alt; } .fa-icon-list-alt:before { content: $fa-icon-list-alt; }
.icon-lock:before { content: $lock; } .fa-icon-lock:before { content: $fa-icon-lock; }
.icon-flag:before { content: $flag; } .fa-icon-flag:before { content: $fa-icon-flag; }
.icon-headphones:before { content: $headphones; } .fa-icon-headphones:before { content: $fa-icon-headphones; }
.icon-volume-off:before { content: $volume-off; } .fa-icon-volume-off:before { content: $fa-icon-volume-off; }
.icon-volume-down:before { content: $volume-down; } .fa-icon-volume-down:before { content: $fa-icon-volume-down; }
.icon-volume-up:before { content: $volume-up; } .fa-icon-volume-up:before { content: $fa-icon-volume-up; }
.icon-qrcode:before { content: $qrcode; } .fa-icon-qrcode:before { content: $fa-icon-qrcode; }
.icon-barcode:before { content: $barcode; } .fa-icon-barcode:before { content: $fa-icon-barcode; }
.icon-tag:before { content: $tag; } .fa-icon-tag:before { content: $fa-icon-tag; }
.icon-tags:before { content: $tags; } .fa-icon-tags:before { content: $fa-icon-tags; }
.icon-book:before { content: $book; } .fa-icon-book:before { content: $fa-icon-book; }
.icon-bookmark:before { content: $bookmark; } .fa-icon-bookmark:before { content: $fa-icon-bookmark; }
.icon-print:before { content: $print; } .fa-icon-print:before { content: $fa-icon-print; }
.icon-camera:before { content: $camera; } .fa-icon-camera:before { content: $fa-icon-camera; }
.icon-font:before { content: $font; } .fa-icon-font:before { content: $fa-icon-font; }
.icon-bold:before { content: $bold; } .fa-icon-bold:before { content: $fa-icon-bold; }
.icon-italic:before { content: $italic; } .fa-icon-italic:before { content: $fa-icon-italic; }
.icon-text-height:before { content: $text-height; } .fa-icon-text-height:before { content: $fa-icon-text-height; }
.icon-text-width:before { content: $text-width; } .fa-icon-text-width:before { content: $fa-icon-text-width; }
.icon-align-left:before { content: $align-left; } .fa-icon-align-left:before { content: $fa-icon-align-left; }
.icon-align-center:before { content: $align-center; } .fa-icon-align-center:before { content: $fa-icon-align-center; }
.icon-align-right:before { content: $align-right; } .fa-icon-align-right:before { content: $fa-icon-align-right; }
.icon-align-justify:before { content: $align-justify; } .fa-icon-align-justify:before { content: $fa-icon-align-justify; }
.icon-list:before { content: $list; } .fa-icon-list:before { content: $fa-icon-list; }
.icon-dedent:before, .fa-icon-dedent:before,
.icon-outdent:before { content: $outdent; } .fa-icon-outdent:before { content: $fa-icon-outdent; }
.icon-indent:before { content: $indent; } .fa-icon-indent:before { content: $fa-icon-indent; }
.icon-video-camera:before { content: $video-camera; } .fa-icon-video-camera:before { content: $fa-icon-video-camera; }
.icon-picture:before { content: $picture; } .fa-icon-picture:before { content: $fa-icon-picture; }
.icon-pencil:before { content: $pencil; } .fa-icon-pencil:before { content: $fa-icon-pencil; }
.icon-map-marker:before { content: $map-marker; } .fa-icon-map-marker:before { content: $fa-icon-map-marker; }
.icon-adjust:before { content: $adjust; } .fa-icon-adjust:before { content: $fa-icon-adjust; }
.icon-tint:before { content: $tint; } .fa-icon-tint:before { content: $fa-icon-tint; }
.icon-edit:before, .fa-icon-edit:before,
.icon-pencil-square-alt:before { content: $pencil-square-alt; } .fa-icon-pencil-square-alt:before { content: $fa-icon-pencil-square-alt; }
.icon-share-square-alt:before { content: $share-square-alt; } .fa-icon-share-square-alt:before { content: $fa-icon-share-square-alt; }
.icon-check-square-alt:before { content: $check-square-alt; } .fa-icon-check-square-alt:before { content: $fa-icon-check-square-alt; }
.icon-move:before { content: $move; } .fa-icon-move:before { content: $fa-icon-move; }
.icon-step-backward:before { content: $step-backward; } .fa-icon-step-backward:before { content: $fa-icon-step-backward; }
.icon-fast-backward:before { content: $fast-backward; } .fa-icon-fast-backward:before { content: $fa-icon-fast-backward; }
.icon-backward:before { content: $backward; } .fa-icon-backward:before { content: $fa-icon-backward; }
.icon-play:before { content: $play; } .fa-icon-play:before { content: $fa-icon-play; }
.icon-pause:before { content: $pause; } .fa-icon-pause:before { content: $fa-icon-pause; }
.icon-stop:before { content: $stop; } .fa-icon-stop:before { content: $fa-icon-stop; }
.icon-forward:before { content: $forward; } .fa-icon-forward:before { content: $fa-icon-forward; }
.icon-fast-forward:before { content: $fast-forward; } .fa-icon-fast-forward:before { content: $fa-icon-fast-forward; }
.icon-step-forward:before { content: $step-forward; } .fa-icon-step-forward:before { content: $fa-icon-step-forward; }
.icon-eject:before { content: $eject; } .fa-icon-eject:before { content: $fa-icon-eject; }
.icon-chevron-left:before { content: $chevron-left; } .fa-icon-chevron-left:before { content: $fa-icon-chevron-left; }
.icon-chevron-right:before { content: $chevron-right; } .fa-icon-chevron-right:before { content: $fa-icon-chevron-right; }
.icon-plus-circle:before { content: $plus-circle; } .fa-icon-plus-circle:before { content: $fa-icon-plus-circle; }
.icon-minus-circle:before { content: $minus-circle; } .fa-icon-minus-circle:before { content: $fa-icon-minus-circle; }
.icon-times-circle:before { content: $times-circle; } .fa-icon-times-circle:before { content: $fa-icon-times-circle; }
.icon-check-circle:before { content: $check-circle; } .fa-icon-check-circle:before { content: $fa-icon-check-circle; }
.icon-question-circle:before { content: $question-circle; } .fa-icon-question-circle:before { content: $fa-icon-question-circle; }
.icon-info-circle:before { content: $info-circle; } .fa-icon-info-circle:before { content: $fa-icon-info-circle; }
.icon-screenshot:before { content: $screenshot; } .fa-icon-screenshot:before { content: $fa-icon-screenshot; }
.icon-times-circle-alt:before { content: $times-circle-alt; } .fa-icon-times-circle-alt:before { content: $fa-icon-times-circle-alt; }
.icon-check-circle-alt:before { content: $check-circle-alt; } .fa-icon-check-circle-alt:before { content: $fa-icon-check-circle-alt; }
.icon-ban:before { content: $ban; } .fa-icon-ban:before { content: $fa-icon-ban; }
.icon-arrow-left:before { content: $arrow-left; } .fa-icon-arrow-left:before { content: $fa-icon-arrow-left; }
.icon-arrow-right:before { content: $arrow-right; } .fa-icon-arrow-right:before { content: $fa-icon-arrow-right; }
.icon-arrow-up:before { content: $arrow-up; } .fa-icon-arrow-up:before { content: $fa-icon-arrow-up; }
.icon-arrow-down:before { content: $arrow-down; } .fa-icon-arrow-down:before { content: $fa-icon-arrow-down; }
.icon-mail-forward:before, .fa-icon-mail-forward:before,
.icon-share:before { content: $share; } .fa-icon-share:before { content: $fa-icon-share; }
.icon-resize-full:before { content: $resize-full; } .fa-icon-resize-full:before { content: $fa-icon-resize-full; }
.icon-resize-small:before { content: $resize-small; } .fa-icon-resize-small:before { content: $fa-icon-resize-small; }
.icon-plus:before { content: $plus; } .fa-icon-plus:before { content: $fa-icon-plus; }
.icon-minus:before { content: $minus; } .fa-icon-minus:before { content: $fa-icon-minus; }
.icon-asterisk:before { content: $asterisk; } .fa-icon-asterisk:before { content: $fa-icon-asterisk; }
.icon-exclamation-circle:before { content: $exclamation-circle; } .fa-icon-exclamation-circle:before { content: $fa-icon-exclamation-circle; }
.icon-gift:before { content: $gift; } .fa-icon-gift:before { content: $fa-icon-gift; }
.icon-leaf:before { content: $leaf; } .fa-icon-leaf:before { content: $fa-icon-leaf; }
.icon-fire:before { content: $fire; } .fa-icon-fire:before { content: $fa-icon-fire; }
.icon-eye:before { content: $eye; } .fa-icon-eye:before { content: $fa-icon-eye; }
.icon-eye-closed:before { content: $eye-closed; } .fa-icon-eye-closed:before { content: $fa-icon-eye-closed; }
.icon-warning:before, .fa-icon-warning:before,
.icon-exclamation-triangle:before { content: $exclamation-triangle; } .fa-icon-exclamation-triangle:before { content: $fa-icon-exclamation-triangle; }
.icon-plane:before { content: $plane; } .fa-icon-plane:before { content: $fa-icon-plane; }
.icon-calendar:before { content: $calendar; } .fa-icon-calendar:before { content: $fa-icon-calendar; }
.icon-random:before { content: $random; } .fa-icon-random:before { content: $fa-icon-random; }
.icon-comment:before { content: $comment; } .fa-icon-comment:before { content: $fa-icon-comment; }
.icon-magnet:before { content: $magnet; } .fa-icon-magnet:before { content: $fa-icon-magnet; }
.icon-chevron-up:before { content: $chevron-up; } .fa-icon-chevron-up:before { content: $fa-icon-chevron-up; }
.icon-chevron-down:before { content: $chevron-down; } .fa-icon-chevron-down:before { content: $fa-icon-chevron-down; }
.icon-retweet:before { content: $retweet; } .fa-icon-retweet:before { content: $fa-icon-retweet; }
.icon-shopping-cart:before { content: $shopping-cart; } .fa-icon-shopping-cart:before { content: $fa-icon-shopping-cart; }
.icon-folder:before { content: $folder; } .fa-icon-folder:before { content: $fa-icon-folder; }
.icon-folder-open:before { content: $folder-open; } .fa-icon-folder-open:before { content: $fa-icon-folder-open; }
.icon-resize-vertical:before { content: $resize-vertical; } .fa-icon-resize-vertical:before { content: $fa-icon-resize-vertical; }
.icon-resize-horizontal:before { content: $resize-horizontal; } .fa-icon-resize-horizontal:before { content: $fa-icon-resize-horizontal; }
.icon-bar-chart:before { content: $bar-chart; } .fa-icon-bar-chart:before { content: $fa-icon-bar-chart; }
.icon-twitter-square:before { content: $twitter-square; } .fa-icon-twitter-square:before { content: $fa-icon-twitter-square; }
.icon-facebook-square:before { content: $facebook-square; } .fa-icon-facebook-square:before { content: $fa-icon-facebook-square; }
.icon-camera-retro:before { content: $camera-retro; } .fa-icon-camera-retro:before { content: $fa-icon-camera-retro; }
.icon-key:before { content: $key; } .fa-icon-key:before { content: $fa-icon-key; }
.icon-gears:before, .fa-icon-gears:before,
.icon-cogs:before { content: $cogs; } .fa-icon-cogs:before { content: $fa-icon-cogs; }
.icon-comments:before { content: $comments; } .fa-icon-comments:before { content: $fa-icon-comments; }
.icon-thumbs-up-alt:before { content: $thumbs-up-alt; } .fa-icon-thumbs-up-alt:before { content: $fa-icon-thumbs-up-alt; }
.icon-thumbs-down-alt:before { content: $thumbs-down-alt; } .fa-icon-thumbs-down-alt:before { content: $fa-icon-thumbs-down-alt; }
.icon-star-half:before { content: $star-half; } .fa-icon-star-half:before { content: $fa-icon-star-half; }
.icon-heart-alt:before { content: $heart-alt; } .fa-icon-heart-alt:before { content: $fa-icon-heart-alt; }
.icon-sign-out:before { content: $sign-out; } .fa-icon-sign-out:before { content: $fa-icon-sign-out; }
.icon-linkedin-square:before { content: $linkedin-square; } .fa-icon-linkedin-square:before { content: $fa-icon-linkedin-square; }
.icon-thumb-tack:before { content: $thumb-tack; } .fa-icon-thumb-tack:before { content: $fa-icon-thumb-tack; }
.icon-external-link:before { content: $external-link; } .fa-icon-external-link:before { content: $fa-icon-external-link; }
.icon-sign-in:before { content: $sign-in; } .fa-icon-sign-in:before { content: $fa-icon-sign-in; }
.icon-trophy:before { content: $trophy; } .fa-icon-trophy:before { content: $fa-icon-trophy; }
.icon-github-square:before { content: $github-square; } .fa-icon-github-square:before { content: $fa-icon-github-square; }
.icon-upload:before { content: $upload; } .fa-icon-upload:before { content: $fa-icon-upload; }
.icon-lemon-alt:before { content: $lemon-alt; } .fa-icon-lemon-alt:before { content: $fa-icon-lemon-alt; }
.icon-phone:before { content: $phone; } .fa-icon-phone:before { content: $fa-icon-phone; }
.icon-unchecked:before, .fa-icon-unchecked:before,
.icon-square-alt:before { content: $square-alt; } .fa-icon-square-alt:before { content: $fa-icon-square-alt; }
.icon-bookmark-alt:before { content: $bookmark-alt; } .fa-icon-bookmark-alt:before { content: $fa-icon-bookmark-alt; }
.icon-phone-square:before { content: $phone-square; } .fa-icon-phone-square:before { content: $fa-icon-phone-square; }
.icon-twitter:before { content: $twitter; } .fa-icon-twitter:before { content: $fa-icon-twitter; }
.icon-facebook:before { content: $facebook; } .fa-icon-facebook:before { content: $fa-icon-facebook; }
.icon-github:before { content: $github; } .fa-icon-github:before { content: $fa-icon-github; }
.icon-unlock:before { content: $unlock; } .fa-icon-unlock:before { content: $fa-icon-unlock; }
.icon-credit-card:before { content: $credit-card; } .fa-icon-credit-card:before { content: $fa-icon-credit-card; }
.icon-rss:before { content: $rss; } .fa-icon-rss:before { content: $fa-icon-rss; }
.icon-hdd:before { content: $hdd; } .fa-icon-hdd:before { content: $fa-icon-hdd; }
.icon-bullhorn:before { content: $bullhorn; } .fa-icon-bullhorn:before { content: $fa-icon-bullhorn; }
.icon-bell:before { content: $bell; } .fa-icon-bell:before { content: $fa-icon-bell; }
.icon-certificate:before { content: $certificate; } .fa-icon-certificate:before { content: $fa-icon-certificate; }
.icon-hand-right:before { content: $hand-right; } .fa-icon-hand-right:before { content: $fa-icon-hand-right; }
.icon-hand-left:before { content: $hand-left; } .fa-icon-hand-left:before { content: $fa-icon-hand-left; }
.icon-hand-up:before { content: $hand-up; } .fa-icon-hand-up:before { content: $fa-icon-hand-up; }
.icon-hand-down:before { content: $hand-down; } .fa-icon-hand-down:before { content: $fa-icon-hand-down; }
.icon-arrow-circle-left:before { content: $arrow-circle-left; } .fa-icon-arrow-circle-left:before { content: $fa-icon-arrow-circle-left; }
.icon-arrow-circle-right:before { content: $arrow-circle-right; } .fa-icon-arrow-circle-right:before { content: $fa-icon-arrow-circle-right; }
.icon-arrow-circle-up:before { content: $arrow-circle-up; } .fa-icon-arrow-circle-up:before { content: $fa-icon-arrow-circle-up; }
.icon-arrow-circle-down:before { content: $arrow-circle-down; } .fa-icon-arrow-circle-down:before { content: $fa-icon-arrow-circle-down; }
.icon-globe:before { content: $globe; } .fa-icon-globe:before { content: $fa-icon-globe; }
.icon-wrench:before { content: $wrench; } .fa-icon-wrench:before { content: $fa-icon-wrench; }
.icon-tasks:before { content: $tasks; } .fa-icon-tasks:before { content: $fa-icon-tasks; }
.icon-filter:before { content: $filter; } .fa-icon-filter:before { content: $fa-icon-filter; }
.icon-briefcase:before { content: $briefcase; } .fa-icon-briefcase:before { content: $fa-icon-briefcase; }
.icon-fullscreen:before { content: $fullscreen; } .fa-icon-fullscreen:before { content: $fa-icon-fullscreen; }
.icon-group:before { content: $group; } .fa-icon-group:before { content: $fa-icon-group; }
.icon-chain:before, .fa-icon-chain:before,
.icon-link:before { content: $link; } .fa-icon-link:before { content: $fa-icon-link; }
.icon-cloud:before { content: $cloud; } .fa-icon-cloud:before { content: $fa-icon-cloud; }
.icon-flask:before { content: $flask; } .fa-icon-flask:before { content: $fa-icon-flask; }
.icon-cut:before, .fa-icon-cut:before,
.icon-scissors:before { content: $scissors; } .fa-icon-scissors:before { content: $fa-icon-scissors; }
.icon-copy:before, .fa-icon-copy:before,
.icon-files:before { content: $files; } .fa-icon-files:before { content: $fa-icon-files; }
.icon-paperclip:before { content: $paperclip; } .fa-icon-paperclip:before { content: $fa-icon-paperclip; }
.icon-save:before, .fa-icon-save:before,
.icon-floppy:before { content: $floppy; } .fa-icon-floppy:before { content: $fa-icon-floppy; }
.icon-square:before { content: $square; } .fa-icon-square:before { content: $fa-icon-square; }
.icon-reorder:before { content: $reorder; } .fa-icon-reorder:before { content: $fa-icon-reorder; }
.icon-list-ul:before { content: $list-ul; } .fa-icon-list-ul:before { content: $fa-icon-list-ul; }
.icon-list-ol:before { content: $list-ol; } .fa-icon-list-ol:before { content: $fa-icon-list-ol; }
.icon-strikethrough:before { content: $strikethrough; } .fa-icon-strikethrough:before { content: $fa-icon-strikethrough; }
.icon-underline:before { content: $underline; } .fa-icon-underline:before { content: $fa-icon-underline; }
.icon-table:before { content: $table; } .fa-icon-table:before { content: $fa-icon-table; }
.icon-magic:before { content: $magic; } .fa-icon-magic:before { content: $fa-icon-magic; }
.icon-truck:before { content: $truck; } .fa-icon-truck:before { content: $fa-icon-truck; }
.icon-pinterest:before { content: $pinterest; } .fa-icon-pinterest:before { content: $fa-icon-pinterest; }
.icon-pinterest-square:before { content: $pinterest-square; } .fa-icon-pinterest-square:before { content: $fa-icon-pinterest-square; }
.icon-google-plus-square:before { content: $google-plus-square; } .fa-icon-google-plus-square:before { content: $fa-icon-google-plus-square; }
.icon-google-plus:before { content: $google-plus; } .fa-icon-google-plus:before { content: $fa-icon-google-plus; }
.icon-money:before { content: $money; } .fa-icon-money:before { content: $fa-icon-money; }
.icon-caret-down:before { content: $caret-down; } .fa-icon-caret-down:before { content: $fa-icon-caret-down; }
.icon-caret-up:before { content: $caret-up; } .fa-icon-caret-up:before { content: $fa-icon-caret-up; }
.icon-caret-left:before { content: $caret-left; } .fa-icon-caret-left:before { content: $fa-icon-caret-left; }
.icon-caret-right:before { content: $caret-right; } .fa-icon-caret-right:before { content: $fa-icon-caret-right; }
.icon-columns:before { content: $columns; } .fa-icon-columns:before { content: $fa-icon-columns; }
.icon-unsorted:before, .fa-icon-unsorted:before,
.icon-sort:before { content: $sort; } .fa-icon-sort:before { content: $fa-icon-sort; }
.icon-sort-down:before, .fa-icon-sort-down:before,
.icon-sort-asc:before { content: $sort-asc; } .fa-icon-sort-asc:before { content: $fa-icon-sort-asc; }
.icon-sort-up:before, .fa-icon-sort-up:before,
.icon-sort-desc:before { content: $sort-desc; } .fa-icon-sort-desc:before { content: $fa-icon-sort-desc; }
.icon-envelope:before { content: $envelope; } .fa-icon-envelope:before { content: $fa-icon-envelope; }
.icon-linkedin:before { content: $linkedin; } .fa-icon-linkedin:before { content: $fa-icon-linkedin; }
.icon-rotate-left:before, .fa-icon-rotate-left:before,
.icon-undo:before { content: $undo; } .fa-icon-undo:before { content: $fa-icon-undo; }
.icon-legal:before, .fa-icon-legal:before,
.icon-gavel:before { content: $gavel; } .fa-icon-gavel:before { content: $fa-icon-gavel; }
.icon-dashboard:before, .fa-icon-dashboard:before,
.icon-tachometer:before { content: $tachometer; } .fa-icon-tachometer:before { content: $fa-icon-tachometer; }
.icon-comment-alt:before { content: $comment-alt; } .fa-icon-comment-alt:before { content: $fa-icon-comment-alt; }
.icon-comments-alt:before { content: $comments-alt; } .fa-icon-comments-alt:before { content: $fa-icon-comments-alt; }
.icon-flash:before, .fa-icon-flash:before,
.icon-bolt:before { content: $bolt; } .fa-icon-bolt:before { content: $fa-icon-bolt; }
.icon-sitemap:before { content: $sitemap; } .fa-icon-sitemap:before { content: $fa-icon-sitemap; }
.icon-umbrella:before { content: $umbrella; } .fa-icon-umbrella:before { content: $fa-icon-umbrella; }
.icon-paste:before, .fa-icon-paste:before,
.icon-clipboard:before { content: $clipboard; } .fa-icon-clipboard:before { content: $fa-icon-clipboard; }
.icon-lightbulb:before { content: $lightbulb; } .fa-icon-lightbulb:before { content: $fa-icon-lightbulb; }
.icon-exchange:before { content: $exchange; } .fa-icon-exchange:before { content: $fa-icon-exchange; }
.icon-cloud-download:before { content: $cloud-download; } .fa-icon-cloud-download:before { content: $fa-icon-cloud-download; }
.icon-cloud-upload:before { content: $cloud-upload; } .fa-icon-cloud-upload:before { content: $fa-icon-cloud-upload; }
.icon-user-md:before { content: $user-md; } .fa-icon-user-md:before { content: $fa-icon-user-md; }
.icon-stethoscope:before { content: $stethoscope; } .fa-icon-stethoscope:before { content: $fa-icon-stethoscope; }
.icon-suitcase:before { content: $suitcase; } .fa-icon-suitcase:before { content: $fa-icon-suitcase; }
.icon-bell-alt:before { content: $bell-alt; } .fa-icon-bell-alt:before { content: $fa-icon-bell-alt; }
.icon-coffee:before { content: $coffee; } .fa-icon-coffee:before { content: $fa-icon-coffee; }
.icon-cutlery:before { content: $cutlery; } .fa-icon-cutlery:before { content: $fa-icon-cutlery; }
.icon-file-text-alt:before { content: $file-text-alt; } .fa-icon-file-text-alt:before { content: $fa-icon-file-text-alt; }
.icon-building:before { content: $building; } .fa-icon-building:before { content: $fa-icon-building; }
.icon-hospital:before { content: $hospital; } .fa-icon-hospital:before { content: $fa-icon-hospital; }
.icon-ambulance:before { content: $ambulance; } .fa-icon-ambulance:before { content: $fa-icon-ambulance; }
.icon-medkit:before { content: $medkit; } .fa-icon-medkit:before { content: $fa-icon-medkit; }
.icon-fighter-jet:before { content: $fighter-jet; } .fa-icon-fighter-jet:before { content: $fa-icon-fighter-jet; }
.icon-beer:before { content: $beer; } .fa-icon-beer:before { content: $fa-icon-beer; }
.icon-h-square:before { content: $h-square; } .fa-icon-h-square:before { content: $fa-icon-h-square; }
.icon-plus-square:before { content: $plus-square; } .fa-icon-plus-square:before { content: $fa-icon-plus-square; }
.icon-double-angle-left:before { content: $double-angle-left; } .fa-icon-double-angle-left:before { content: $fa-icon-double-angle-left; }
.icon-double-angle-right:before { content: $double-angle-right; } .fa-icon-double-angle-right:before { content: $fa-icon-double-angle-right; }
.icon-double-angle-up:before { content: $double-angle-up; } .fa-icon-double-angle-up:before { content: $fa-icon-double-angle-up; }
.icon-double-angle-down:before { content: $double-angle-down; } .fa-icon-double-angle-down:before { content: $fa-icon-double-angle-down; }
.icon-angle-left:before { content: $angle-left; } .fa-icon-angle-left:before { content: $fa-icon-angle-left; }
.icon-angle-right:before { content: $angle-right; } .fa-icon-angle-right:before { content: $fa-icon-angle-right; }
.icon-angle-up:before { content: $angle-up; } .fa-icon-angle-up:before { content: $fa-icon-angle-up; }
.icon-angle-down:before { content: $angle-down; } .fa-icon-angle-down:before { content: $fa-icon-angle-down; }
.icon-desktop:before { content: $desktop; } .fa-icon-desktop:before { content: $fa-icon-desktop; }
.icon-laptop:before { content: $laptop; } .fa-icon-laptop:before { content: $fa-icon-laptop; }
.icon-tablet:before { content: $tablet; } .fa-icon-tablet:before { content: $fa-icon-tablet; }
.icon-mobile-phone:before, .fa-icon-mobile-phone:before,
.icon-mobile:before { content: $mobile; } .fa-icon-mobile:before { content: $fa-icon-mobile; }
.icon-circle-alt:before { content: $circle-alt; } .fa-icon-circle-alt:before { content: $fa-icon-circle-alt; }
.icon-quote-left:before { content: $quote-left; } .fa-icon-quote-left:before { content: $fa-icon-quote-left; }
.icon-quote-right:before { content: $quote-right; } .fa-icon-quote-right:before { content: $fa-icon-quote-right; }
.icon-spinner:before { content: $spinner; } .fa-icon-spinner:before { content: $fa-icon-spinner; }
.icon-circle:before { content: $circle; } .fa-icon-circle:before { content: $fa-icon-circle; }
.icon-mail-reply:before, .fa-icon-mail-reply:before,
.icon-reply:before { content: $reply; } .fa-icon-reply:before { content: $fa-icon-reply; }
.icon-github-alt:before { content: $github-alt; } .fa-icon-github-alt:before { content: $fa-icon-github-alt; }
.icon-folder-alt:before { content: $folder-alt; } .fa-icon-folder-alt:before { content: $fa-icon-folder-alt; }
.icon-folder-open-alt:before { content: $folder-open-alt; } .fa-icon-folder-open-alt:before { content: $fa-icon-folder-open-alt; }
.icon-expand-alt:before { content: $expand-alt; } .fa-icon-expand-alt:before { content: $fa-icon-expand-alt; }
.icon-collapse-alt:before { content: $collapse-alt; } .fa-icon-collapse-alt:before { content: $fa-icon-collapse-alt; }
.icon-smile:before { content: $smile; } .fa-icon-smile:before { content: $fa-icon-smile; }
.icon-frown:before { content: $frown; } .fa-icon-frown:before { content: $fa-icon-frown; }
.icon-meh:before { content: $meh; } .fa-icon-meh:before { content: $fa-icon-meh; }
.icon-gamepad:before { content: $gamepad; } .fa-icon-gamepad:before { content: $fa-icon-gamepad; }
.icon-keyboard:before { content: $keyboard; } .fa-icon-keyboard:before { content: $fa-icon-keyboard; }
.icon-flag-alt:before { content: $flag-alt; } .fa-icon-flag-alt:before { content: $fa-icon-flag-alt; }
.icon-flag-checkered:before { content: $flag-checkered; } .fa-icon-flag-checkered:before { content: $fa-icon-flag-checkered; }
.icon-terminal:before { content: $terminal; } .fa-icon-terminal:before { content: $fa-icon-terminal; }
.icon-code:before { content: $code; } .fa-icon-code:before { content: $fa-icon-code; }
.icon-reply-all:before { content: $reply-all; } .fa-icon-reply-all:before { content: $fa-icon-reply-all; }
.icon-mail-reply-all:before { content: $mail-reply-all; } .fa-icon-mail-reply-all:before { content: $fa-icon-mail-reply-all; }
.icon-star-half-empty:before, .fa-icon-star-half-empty:before,
.icon-star-half-full:before, .fa-icon-star-half-full:before,
.icon-star-half-alt:before { content: $star-half-alt; } .fa-icon-star-half-alt:before { content: $fa-icon-star-half-alt; }
.icon-location-arrow:before { content: $location-arrow; } .fa-icon-location-arrow:before { content: $fa-icon-location-arrow; }
.icon-crop:before { content: $crop; } .fa-icon-crop:before { content: $fa-icon-crop; }
.icon-code-fork:before { content: $code-fork; } .fa-icon-code-fork:before { content: $fa-icon-code-fork; }
.icon-unlink:before, .fa-icon-unlink:before,
.icon-chain-broken:before { content: $chain-broken; } .fa-icon-chain-broken:before { content: $fa-icon-chain-broken; }
.icon-question:before { content: $question; } .fa-icon-question:before { content: $fa-icon-question; }
.icon-info:before { content: $info; } .fa-icon-info:before { content: $fa-icon-info; }
.icon-exclamation:before { content: $exclamation; } .fa-icon-exclamation:before { content: $fa-icon-exclamation; }
.icon-superscript:before { content: $superscript; } .fa-icon-superscript:before { content: $fa-icon-superscript; }
.icon-subscript:before { content: $subscript; } .fa-icon-subscript:before { content: $fa-icon-subscript; }
.icon-eraser:before { content: $eraser; } .fa-icon-eraser:before { content: $fa-icon-eraser; }
.icon-puzzle-piece:before { content: $puzzle-piece; } .fa-icon-puzzle-piece:before { content: $fa-icon-puzzle-piece; }
.icon-microphone:before { content: $microphone; } .fa-icon-microphone:before { content: $fa-icon-microphone; }
.icon-microphone-off:before { content: $microphone-off; } .fa-icon-microphone-off:before { content: $fa-icon-microphone-off; }
.icon-shield:before { content: $shield; } .fa-icon-shield:before { content: $fa-icon-shield; }
.icon-calendar-alt:before { content: $calendar-alt; } .fa-icon-calendar-alt:before { content: $fa-icon-calendar-alt; }
.icon-fire-extinguisher:before { content: $fire-extinguisher; } .fa-icon-fire-extinguisher:before { content: $fa-icon-fire-extinguisher; }
.icon-rocket:before { content: $rocket; } .fa-icon-rocket:before { content: $fa-icon-rocket; }
.icon-maxcdn:before { content: $maxcdn; } .fa-icon-maxcdn:before { content: $fa-icon-maxcdn; }
.icon-chevron-circle-left:before { content: $chevron-circle-left; } .fa-icon-chevron-circle-left:before { content: $fa-icon-chevron-circle-left; }
.icon-chevron-circle-right:before { content: $chevron-circle-right; } .fa-icon-chevron-circle-right:before { content: $fa-icon-chevron-circle-right; }
.icon-chevron-circle-up:before { content: $chevron-circle-up; } .fa-icon-chevron-circle-up:before { content: $fa-icon-chevron-circle-up; }
.icon-chevron-circle-down:before { content: $chevron-circle-down; } .fa-icon-chevron-circle-down:before { content: $fa-icon-chevron-circle-down; }
.icon-html5:before { content: $html5; } .fa-icon-html5:before { content: $fa-icon-html5; }
.icon-css3:before { content: $css3; } .fa-icon-css3:before { content: $fa-icon-css3; }
.icon-anchor:before { content: $anchor; } .fa-icon-anchor:before { content: $fa-icon-anchor; }
.icon-unlock-alt:before { content: $unlock-alt; } .fa-icon-unlock-alt:before { content: $fa-icon-unlock-alt; }
.icon-bullseye:before { content: $bullseye; } .fa-icon-bullseye:before { content: $fa-icon-bullseye; }
.icon-ellipsis-horizontal:before { content: $ellipsis-horizontal; } .fa-icon-ellipsis-horizontal:before { content: $fa-icon-ellipsis-horizontal; }
.icon-ellipsis-vertical:before { content: $ellipsis-vertical; } .fa-icon-ellipsis-vertical:before { content: $fa-icon-ellipsis-vertical; }
.icon-rss-square:before { content: $rss-square; } .fa-icon-rss-square:before { content: $fa-icon-rss-square; }
.icon-play-circle:before { content: $play-circle; } .fa-icon-play-circle:before { content: $fa-icon-play-circle; }
.icon-ticket:before { content: $ticket; } .fa-icon-ticket:before { content: $fa-icon-ticket; }
.icon-minus-square:before { content: $minus-square; } .fa-icon-minus-square:before { content: $fa-icon-minus-square; }
.icon-minus-square-alt:before { content: $minus-square-alt; } .fa-icon-minus-square-alt:before { content: $fa-icon-minus-square-alt; }
.icon-level-up:before { content: $level-up; } .fa-icon-level-up:before { content: $fa-icon-level-up; }
.icon-level-down:before { content: $level-down; } .fa-icon-level-down:before { content: $fa-icon-level-down; }
.icon-check-square:before { content: $check-square; } .fa-icon-check-square:before { content: $fa-icon-check-square; }
.icon-pencil-square:before { content: $pencil-square; } .fa-icon-pencil-square:before { content: $fa-icon-pencil-square; }
.icon-external-link-square:before { content: $external-link-square; } .fa-icon-external-link-square:before { content: $fa-icon-external-link-square; }
.icon-share-square:before { content: $share-square; } .fa-icon-share-square:before { content: $fa-icon-share-square; }
.icon-compass:before { content: $compass; } .fa-icon-compass:before { content: $fa-icon-compass; }
.icon-collapse-down:before { content: $collapse-down; } .fa-icon-collapse-down:before { content: $fa-icon-collapse-down; }
.icon-collapse-up:before { content: $collapse-up; } .fa-icon-collapse-up:before { content: $fa-icon-collapse-up; }
.icon-expand:before { content: $expand; } .fa-icon-expand:before { content: $fa-icon-expand; }
.icon-euro:before, .fa-icon-euro:before,
.icon-eur:before { content: $eur; } .fa-icon-eur:before { content: $fa-icon-eur; }
.icon-gbp:before { content: $gbp; } .fa-icon-gbp:before { content: $fa-icon-gbp; }
.icon-dollar:before, .fa-icon-dollar:before,
.icon-usd:before { content: $usd; } .fa-icon-usd:before { content: $fa-icon-usd; }
.icon-rupee:before, .fa-icon-rupee:before,
.icon-inr:before { content: $inr; } .fa-icon-inr:before { content: $fa-icon-inr; }
.icon-cny:before, .fa-icon-cny:before,
.icon-rmb:before, .fa-icon-rmb:before,
.icon-yen:before, .fa-icon-yen:before,
.icon-jpy:before { content: $jpy; } .fa-icon-jpy:before { content: $fa-icon-jpy; }
.icon-ruble:before, .fa-icon-ruble:before,
.icon-rouble:before, .fa-icon-rouble:before,
.icon-rub:before { content: $rub; } .fa-icon-rub:before { content: $fa-icon-rub; }
.icon-won:before, .fa-icon-won:before,
.icon-krw:before { content: $krw; } .fa-icon-krw:before { content: $fa-icon-krw; }
.icon-bitcoin:before, .fa-icon-bitcoin:before,
.icon-btc:before { content: $btc; } .fa-icon-btc:before { content: $fa-icon-btc; }
.icon-file:before { content: $file; } .fa-icon-file:before { content: $fa-icon-file; }
.icon-file-text:before { content: $file-text; } .fa-icon-file-text:before { content: $fa-icon-file-text; }
.icon-sort-alpha-asc:before { content: $sort-alpha-asc; } .fa-icon-sort-alpha-asc:before { content: $fa-icon-sort-alpha-asc; }
.icon-sort-alpha-desc:before { content: $sort-alpha-desc; } .fa-icon-sort-alpha-desc:before { content: $fa-icon-sort-alpha-desc; }
.icon-sort-amount-asc:before { content: $sort-amount-asc; } .fa-icon-sort-amount-asc:before { content: $fa-icon-sort-amount-asc; }
.icon-sort-amount-desc:before { content: $sort-amount-desc; } .fa-icon-sort-amount-desc:before { content: $fa-icon-sort-amount-desc; }
.icon-sort-numeric-asc:before { content: $sort-numeric-asc; } .fa-icon-sort-numeric-asc:before { content: $fa-icon-sort-numeric-asc; }
.icon-sort-numeric-desc:before { content: $sort-numeric-desc; } .fa-icon-sort-numeric-desc:before { content: $fa-icon-sort-numeric-desc; }
.icon-thumbs-up:before { content: $thumbs-up; } .fa-icon-thumbs-up:before { content: $fa-icon-thumbs-up; }
.icon-thumbs-down:before { content: $thumbs-down; } .fa-icon-thumbs-down:before { content: $fa-icon-thumbs-down; }
.icon-youtube-sign:before { content: $youtube-sign; } .fa-icon-youtube-sign:before { content: $fa-icon-youtube-sign; }
.icon-youtube:before { content: $youtube; } .fa-icon-youtube:before { content: $fa-icon-youtube; }
.icon-xing:before { content: $xing; } .fa-icon-xing:before { content: $fa-icon-xing; }
.icon-xing-sign:before { content: $xing-sign; } .fa-icon-xing-sign:before { content: $fa-icon-xing-sign; }
.icon-youtube-play:before { content: $youtube-play; } .fa-icon-youtube-play:before { content: $fa-icon-youtube-play; }
.icon-dropbox:before { content: $dropbox; } .fa-icon-dropbox:before { content: $fa-icon-dropbox; }
.icon-stack-overflow:before { content: $stack-overflow; } .fa-icon-stack-overflow:before { content: $fa-icon-stack-overflow; }
.icon-instagram:before { content: $instagram; } .fa-icon-instagram:before { content: $fa-icon-instagram; }
.icon-flickr:before { content: $flickr; } .fa-icon-flickr:before { content: $fa-icon-flickr; }
.icon-adn:before { content: $adn; } .fa-icon-adn:before { content: $fa-icon-adn; }
.icon-bitbucket:before { content: $bitbucket; } .fa-icon-bitbucket:before { content: $fa-icon-bitbucket; }
.icon-bitbucket-square:before { content: $bitbucket-square; } .fa-icon-bitbucket-square:before { content: $fa-icon-bitbucket-square; }
.icon-tumblr:before { content: $tumblr; } .fa-icon-tumblr:before { content: $fa-icon-tumblr; }
.icon-tumblr-square:before { content: $tumblr-square; } .fa-icon-tumblr-square:before { content: $fa-icon-tumblr-square; }
.icon-long-arrow-down:before { content: $long-arrow-down; } .fa-icon-long-arrow-down:before { content: $fa-icon-long-arrow-down; }
.icon-long-arrow-up:before { content: $long-arrow-up; } .fa-icon-long-arrow-up:before { content: $fa-icon-long-arrow-up; }
.icon-long-arrow-left:before { content: $long-arrow-left; } .fa-icon-long-arrow-left:before { content: $fa-icon-long-arrow-left; }
.icon-long-arrow-right:before { content: $long-arrow-right; } .fa-icon-long-arrow-right:before { content: $fa-icon-long-arrow-right; }
.icon-apple:before { content: $apple; } .fa-icon-apple:before { content: $fa-icon-apple; }
.icon-windows:before { content: $windows; } .fa-icon-windows:before { content: $fa-icon-windows; }
.icon-android:before { content: $android; } .fa-icon-android:before { content: $fa-icon-android; }
.icon-linux:before { content: $linux; } .fa-icon-linux:before { content: $fa-icon-linux; }
.icon-dribbble:before { content: $dribbble; } .fa-icon-dribbble:before { content: $fa-icon-dribbble; }
.icon-skype:before { content: $skype; } .fa-icon-skype:before { content: $fa-icon-skype; }
.icon-foursquare:before { content: $foursquare; } .fa-icon-foursquare:before { content: $fa-icon-foursquare; }
.icon-trello:before { content: $trello; } .fa-icon-trello:before { content: $fa-icon-trello; }
.icon-female:before { content: $female; } .fa-icon-female:before { content: $fa-icon-female; }
.icon-male:before { content: $male; } .fa-icon-male:before { content: $fa-icon-male; }
.icon-gittip:before { content: $gittip; } .fa-icon-gittip:before { content: $fa-icon-gittip; }
.icon-sun:before { content: $sun; } .fa-icon-sun:before { content: $fa-icon-sun; }
.icon-moon:before { content: $moon; } .fa-icon-moon:before { content: $fa-icon-moon; }
.icon-archive:before { content: $archive; } .fa-icon-archive:before { content: $fa-icon-archive; }
.icon-bug:before { content: $bug; } .fa-icon-bug:before { content: $fa-icon-bug; }
.icon-vk:before { content: $vk; } .fa-icon-vk:before { content: $fa-icon-vk; }
.icon-weibo:before { content: $weibo; } .fa-icon-weibo:before { content: $fa-icon-weibo; }
.icon-renren:before { content: $renren; } .fa-icon-renren:before { content: $fa-icon-renren; }
.icon-pagelines:before { content: $pagelines; } .fa-icon-pagelines:before { content: $fa-icon-pagelines; }
.icon-stack-exchange:before { content: $stack-exchange; } .fa-icon-stack-exchange:before { content: $fa-icon-stack-exchange; }

View file

@ -1,38 +1,32 @@
// Mixins // Mixins
// -------------------------- // --------------------------
@mixin icon($icon) { @mixin fa-icon-rotate($degrees, $rotation) {
@include icon-FontAwesome(); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
content: $icon; -webkit-transform: rotate($degrees);
-moz-transform: rotate($degrees);
-ms-transform: rotate($degrees);
-o-transform: rotate($degrees);
transform: rotate($degrees);
} }
@mixin icon-FontAwesome() { @mixin fa-icon-flip($horiz, $vert) {
*margin-right: .3em; // fixes ie7 issues -webkit-transform: scale($horiz, $vert);
font-family: FontAwesome; -moz-transform: scale($horiz, $vert);
-webkit-font-smoothing: antialiased; -ms-transform: scale($horiz, $vert);
font-style: normal; -o-transform: scale($horiz, $vert);
font-weight: normal; transform: scale($horiz, $vert);
text-decoration: inherit;
text-rendering: auto;
-moz-osx-font-smoothing: grayscale;
} }
@mixin border-radius($radius) { @mixin fa-icon-stack($width: 2em, $height: 2em, $top-font-size: 1em, $base-font-size: 2em) {
-webkit-border-radius: $radius; .fa-icon-stack {
-moz-border-radius: $radius;
border-radius: $radius;
}
@mixin icon-stack($width: 2em, $height: 2em, $top-font-size: 1em, $base-font-size: 2em) {
.icon-stack {
position: relative; position: relative;
display: inline-block; display: inline-block;
width: $width; width: $width;
height: $height; height: $height;
line-height: $width; line-height: $width;
vertical-align: -35%; vertical-align: -35%;
[class^="icon-"], .fa-icon {
[class*=" icon-"] {
position: absolute; position: absolute;
display: block; display: block;
width: 100%; width: 100%;
@ -42,9 +36,9 @@
*line-height: $height; *line-height: $height;
text-align: center; text-align: center;
} }
.icon-stack-base { .fa-icon-stack-base {
font-size: $base-font-size; font-size: $base-font-size;
*line-height: #{$height / $base-font-size}em; *line-height: ($height / $base-font-size);
} }
} }
} }

View file

@ -3,12 +3,12 @@
@font-face { @font-face {
font-family: 'FontAwesome'; font-family: 'FontAwesome';
src: url('#{$FontAwesomePath}/fontawesome-webfont.eot?v=#{$FontAwesomeVersion}'); src: url('#{$fa-font-path}/fontawesome-webfont.eot?v=#{$fa-version}');
src: url('#{$FontAwesomePath}/fontawesome-webfont.eot?#iefix&v=#{$FontAwesomeVersion}') format('embedded-opentype'), src: url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
url('#{$FontAwesomePath}/fontawesome-webfont.woff?v=#{$FontAwesomeVersion}') format('woff'), url('#{$fa-font-path}/fontawesome-webfont.woff?v=#{$fa-version}') format('woff'),
url('#{$FontAwesomePath}/fontawesome-webfont.ttf?v=#{$FontAwesomeVersion}') format('truetype'), url('#{$fa-font-path}/fontawesome-webfont.ttf?v=#{$fa-version}') format('truetype'),
url('#{$FontAwesomePath}/fontawesome-webfont.svg?v=#{$FontAwesomeVersion}#fontawesomeregular') format('svg'); url('#{$fa-font-path}/fontawesome-webfont.svg?v=#{$fa-version}#fontawesomeregular') format('svg');
// src: url('#{$FontAwesomePath}/FontAwesome.otf') format('opentype'); // used when developing fonts //src: url('#{$fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }

File diff suppressed because it is too large Load diff

View file

@ -28,6 +28,5 @@
@import "mixins"; @import "mixins";
@import "path"; @import "path";
@import "core"; @import "core";
@import "bootstrap";
@import "extras"; @import "extras";
@import "icons"; @import "icons";

View file

@ -4,9 +4,11 @@ PATH := ../node_modules/.bin:$(PATH)
FA_ROOT_DIRECTORY = assets/font-awesome FA_ROOT_DIRECTORY = assets/font-awesome
FA_LESS_DIRECTORY = assets/font-awesome/less FA_LESS_DIRECTORY = assets/font-awesome/less
FA_SCSS_DIRECTORY = assets/font-awesome/scss
FA_CSS_DIRECTORY = assets/font-awesome/css FA_CSS_DIRECTORY = assets/font-awesome/css
FA_LESS_MODERN = ${FA_LESS_DIRECTORY}/font-awesome.less FA_LESS_MODERN = ${FA_LESS_DIRECTORY}/font-awesome.less
FA_SCSS_MODERN = ${FA_SCSS_DIRECTORY}/font-awesome.scss
FA_CSS_MODERN = ${FA_CSS_DIRECTORY}/font-awesome.css FA_CSS_MODERN = ${FA_CSS_DIRECTORY}/font-awesome.css
FA_CSS_MODERN_MIN = ${FA_CSS_DIRECTORY}/font-awesome.min.css FA_CSS_MODERN_MIN = ${FA_CSS_DIRECTORY}/font-awesome.min.css
@ -20,8 +22,11 @@ SITE_CSS_MIN = ${SITE_CSS_DIRECTORY}/site.css
build: build:
@echo "Compiling Less files" @echo "Compiling Less files"
@mkdir -p ${FA_CSS_DIRECTORY} @mkdir -p ${FA_CSS_DIRECTORY}
lessc ${FA_LESS_MODERN} > ${FA_CSS_MODERN} lessc ${FA_LESS_MODERN} > ${FA_CSS_MODERN}
lessc --compress ${FA_LESS_MODERN} > ${FA_CSS_MODERN_MIN} lessc --compress ${FA_LESS_MODERN} > ${FA_CSS_MODERN_MIN}
# sass ${FA_SCSS_MODERN} ${FA_CSS_MODERN}
lessc --compress ${SITE_LESS} > ${SITE_CSS_MIN} lessc --compress ${SITE_LESS} > ${SITE_CSS_MIN}
cp -r ${FA_ROOT_DIRECTORY}/* ../ cp -r ${FA_ROOT_DIRECTORY}/* ../
cd assets && zip -r9 font-awesome.zip font-awesome cd assets && zip -r9 font-awesome.zip font-awesome

View file

@ -51,6 +51,7 @@
} }
} }
// allows usage of the hide class directly on font awesome icons // allows usage of the hide class directly on font awesome icons
.{{ site.fontawesome.css_prefix }}.hide { display: none; } .{{ site.fontawesome.css_prefix }}.hide { display: none; }
@ -68,6 +69,7 @@
border-radius: 3px; border-radius: 3px;
} }
// Icon Sizes // Icon Sizes
// ------------------------- // -------------------------
@ -92,7 +94,6 @@
border-radius: 6px; border-radius: 6px;
} }
} }
.{{ site.fontawesome.css_prefix }}-5x { .{{ site.fontawesome.css_prefix }}-5x {
font-size: 5em; font-size: 5em;
&.{{ site.fontawesome.css_prefix }}-border { &.{{ site.fontawesome.css_prefix }}-border {

View file

@ -1,84 +0,0 @@
/* BOOTSTRAP SPECIFIC CLASSES
* -------------------------- */
/* Bootstrap 2.0 sprites.less reset */
[class^="icon-"],
[class*=" icon-"] {
display: inline;
width: auto;
height: auto;
margin-top: 0;
line-height: normal;
vertical-align: baseline;
background-image: none;
background-position: 0 0;
background-repeat: repeat;
}
/* more sprites.less reset */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
.nav-list > .active > a > [class^="icon-"],
.nav-list > .active > a > [class*=" icon-"],
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"] {
background-image: none;
}
/* keeps Bootstrap styles with and without icons the same */
.btn, .nav {
[class^="icon-"],
[class*=" icon-"] {
// display: inline;
&.icon-large { line-height: .9em; }
&.icon-spin { display: inline-block; }
}
}
.nav-tabs, .nav-pills {
[class^="icon-"],
[class*=" icon-"] {
&, &.icon-large { line-height: .9em; }
}
}
.btn {
[class^="icon-"],
[class*=" icon-"] {
&.pull-left, &.pull-right {
&.icon-2x { margin-top: .18em; }
}
&.icon-spin.icon-large { line-height: .8em; }
}
}
.btn.btn-small {
[class^="icon-"],
[class*=" icon-"] {
&.pull-left, &.pull-right {
&.icon-2x { margin-top: .25em; }
}
}
}
.btn.btn-large {
[class^="icon-"],
[class*=" icon-"] {
margin-top: 0; // overrides bootstrap default
&.pull-left, &.pull-right {
&.icon-2x { margin-top: .05em; }
}
&.pull-left.icon-2x { margin-right: .2em; }
&.pull-right.icon-2x { margin-left: .2em; }
}
}
/* Fixes alignment in nav lists */
.nav-list [class^="icon-"],
.nav-list [class*=" icon-"] {
line-height: inherit;
}

View file

@ -1,113 +1,104 @@
---
---
/* FONT AWESOME CORE /* FONT AWESOME CORE
* -------------------------- */ * -------------------------- */
[class^="icon-"], .{{ site.fontawesome.css_prefix }} {
[class*=" icon-"] {
@include icon-FontAwesome();
}
[class^="icon-"]:before,
[class*=" icon-"]:before {
display: inline-block; display: inline-block;
text-decoration: inherit; font-family: FontAwesome;
speak: none; font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
} }
/* makes the font 33% larger relative to the icon container */ /* makes the font 33% larger relative to the icon container */
.icon-large:before { .{{ site.fontawesome.css_prefix }}-lg {
font-size: (4em/3); font-size: (4em / 3);
vertical-align: -10%; line-height: (3em / 4);
vertical-align: -15%;
} }
/* increased font size for icon-lg */
/* makes sure icons active on rollover in links */ .{{ site.fontawesome.css_prefix }}-fixed-width {
a { width: (16em / 14);
[class^="icon-"], padding-right: (4em / 14);
[class*=" icon-"] { text-align: right;
display: inline; &.{{ site.fontawesome.css_prefix }}-lg {
width: (20em / 14);
} }
} }
/* increased font size for icon-large */
[class^="icon-"],
[class*=" icon-"] {
&.icon-fixed-width {
display: inline-block;
width: (16em/14);
padding-right: (4em/14);
text-align: right;
&.icon-large {
width: (20em/14);
}
}
}
.icons-ul { // Icon UL & LI
// -------------------------
.{{ site.fontawesome.css_prefix }}-ul {
padding-left: 0; padding-left: 0;
margin-left: $icons-li-width; margin-left: $fa-icon-li-width;
list-style-type: none; list-style-type: none;
> li { position: relative; } > li { position: relative; }
}
.icon-li { .{{ site.fontawesome.css_prefix }}-li {
position: absolute; position: absolute;
left: -$icons-li-width; left: -$fa-icon-li-width;
width: $icons-li-width; width: $fa-icon-li-width;
line-height: inherit; top: (2em / 14);
text-align: center; text-align: center;
&.{{ site.fontawesome.css_prefix }}-lg {
left: -$fa-icon-li-width + (4em / 14);
} }
} }
// allows usage of the hide class directly on font awesome icons // allows usage of the hide class directly on font awesome icons
[class^="icon-"], .{{ site.fontawesome.css_prefix }}.hide { display: none; }
[class*=" icon-"] {
&.hide { .{{ site.fontawesome.css_prefix }}-muted { color: $fa-icon-muted; }
display: none; .{{ site.fontawesome.css_prefix }}-light { color: $fa-icon-light; }
} .{{ site.fontawesome.css_prefix }}-dark { color: $fa-icon-dark; }
}
.icon-muted { color: $iconMuted; }
.icon-light { color: $iconLight; }
.icon-dark { color: $iconDark; }
// Icon Borders // Icon Borders
// ------------------------- // -------------------------
.icon-border { .{{ site.fontawesome.css_prefix }}-border {
padding: .2em .25em .15em; padding: .2em .25em .15em;
border: solid 1px $borderColor; border: solid 1px $fa-border-color;
@include border-radius(3px); border-radius: 3px;
} }
// Icon Sizes // Icon Sizes
// ------------------------- // -------------------------
.icon-2x { .{{ site.fontawesome.css_prefix }}-2x {
font-size: 2em; font-size: 2em;
&.icon-border { &.{{ site.fontawesome.css_prefix }}-border {
border-width: 2px; border-width: 2px;
@include border-radius(4px); border-radius: 4px;
} }
} }
.icon-3x { .{{ site.fontawesome.css_prefix }}-3x {
font-size: 3em; font-size: 3em;
&.icon-border { &.{{ site.fontawesome.css_prefix }}-border {
border-width: 3px; border-width: 3px;
@include border-radius(5px); border-radius: 5px;
} }
} }
.icon-4x { .{{ site.fontawesome.css_prefix }}-4x {
font-size: 4em; font-size: 4em;
&.icon-border { &.{{ site.fontawesome.css_prefix }}-border {
border-width: 4px; border-width: 4px;
@include border-radius(6px); border-radius: 6px;
} }
} }
.{{ site.fontawesome.css_prefix }}-5x {
.icon-5x {
font-size: 5em; font-size: 5em;
&.icon-border { &.{{ site.fontawesome.css_prefix }}-border {
border-width: 5px; border-width: 5px;
@include border-radius(7px); border-radius: 7px;
} }
} }
@ -119,12 +110,7 @@ a {
.pull-right { float: right; } .pull-right { float: right; }
.pull-left { float: left; } .pull-left { float: left; }
[class^="icon-"], .{{ site.fontawesome.css_prefix }} {
[class*=" icon-"] { &.pull-left { margin-right: .3em; }
&.pull-left { &.pull-right { margin-left: .3em; }
margin-right: .3em;
}
&.pull-right {
margin-left: .3em;
}
} }

View file

@ -1,25 +1,19 @@
---
---
/* EXTRAS /* EXTRAS
* -------------------------- */ * -------------------------- */
/* Stacked and layered icon */ /* Stacked and layered icon */
@include icon-stack(); @include {{ site.fontawesome.css_prefix }}-stack();
/* Animated rotating icon */ /* Animated rotating icon */
.icon-spin { .{{ site.fontawesome.css_prefix }}-spin {
display: inline-block;
-webkit-animation: spin 2s infinite linear; -webkit-animation: spin 2s infinite linear;
-moz-animation: spin 2s infinite linear; -moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear; -o-animation: spin 2s infinite linear;
animation: spin 2s infinite linear; animation: spin 2s infinite linear;
} }
/* Prevent stack and spinners from being taken inline when inside a link */
a .icon-stack,
a .icon-spin {
display: inline-block;
text-decoration: none;
}
@-moz-keyframes spin { @-moz-keyframes spin {
0% { -moz-transform: rotate(0deg); } 0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(359deg); } 100% { -moz-transform: rotate(359deg); }
@ -41,53 +35,13 @@ a .icon-spin {
100% { transform: rotate(359deg); } 100% { transform: rotate(359deg); }
} }
/* Icon rotations and mirroring */
.icon-rotate-90:before {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
.icon-rotate-180:before { // Icon rotations & flipping
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); // -------------------------
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
.icon-rotate-270:before { .{{ site.fontawesome.css_prefix }}-rotate-90 { @include {{ site.fontawesome.css_prefix }}-rotate(90deg, 1); }
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); .{{ site.fontawesome.css_prefix }}-rotate-180 { @include {{ site.fontawesome.css_prefix }}-rotate(180deg, 2); }
-webkit-transform: rotate(270deg); .{{ site.fontawesome.css_prefix }}-rotate-270 { @include {{ site.fontawesome.css_prefix }}-rotate(270deg, 3); }
-moz-transform: rotate(270deg);
-ms-transform: rotate(270deg);
-o-transform: rotate(270deg);
transform: rotate(270deg);
}
.icon-flip-horizontal:before { .{{ site.fontawesome.css_prefix }}-flip-horizontal { @include {{ site.fontawesome.css_prefix }}-flip(-1, 1); }
-webkit-transform: scale(-1, 1); .{{ site.fontawesome.css_prefix }}-flip-vertical { @include {{ site.fontawesome.css_prefix }}-flip(1, -1); }
-moz-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
transform: scale(-1, 1);
}
.icon-flip-vertical:before {
-webkit-transform: scale(1, -1);
-moz-transform: scale(1, -1);
-ms-transform: scale(1, -1);
-o-transform: scale(1, -1);
transform: scale(1, -1);
}
/* ensure rotation occurs inside anchor tags */
a {
.icon-rotate-90, .icon-rotate-180, .icon-rotate-270, .icon-flip-horizontal, .icon-flip-vertical {
&:before { display: inline-block; }
}
}

View file

@ -1,7 +1,7 @@
--- ---
--- ---
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
* readers do not read off random characters that represent icons */ readers do not read off random characters that represent icons */
{% for icon in icons %}{% for alias in icon.aliases %} {% for icon in icons %}{% for alias in icon.aliases %}
.icon-{{ alias }}:before,{% endfor %} .{{ site.fontawesome.css_prefix }}-{{ alias }}:before,{% endfor %}
.icon-{{ icon.id }}:before { content: ${{ icon.id }}; }{% endfor %} .{{ site.fontawesome.css_prefix }}-{{ icon.id }}:before { content: ${{ site.fontawesome.css_prefix }}-{{ icon.id }}; }{% endfor %}

View file

@ -1,38 +1,34 @@
---
---
// Mixins // Mixins
// -------------------------- // --------------------------
@mixin icon($icon) { @mixin {{ site.fontawesome.css_prefix }}-rotate($degrees, $rotation) {
@include icon-FontAwesome(); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
content: $icon; -webkit-transform: rotate($degrees);
-moz-transform: rotate($degrees);
-ms-transform: rotate($degrees);
-o-transform: rotate($degrees);
transform: rotate($degrees);
} }
@mixin icon-FontAwesome() { @mixin {{ site.fontawesome.css_prefix }}-flip($horiz, $vert) {
*margin-right: .3em; // fixes ie7 issues -webkit-transform: scale($horiz, $vert);
font-family: FontAwesome; -moz-transform: scale($horiz, $vert);
-webkit-font-smoothing: antialiased; -ms-transform: scale($horiz, $vert);
font-style: normal; -o-transform: scale($horiz, $vert);
font-weight: normal; transform: scale($horiz, $vert);
text-decoration: inherit;
text-rendering: auto;
-moz-osx-font-smoothing: grayscale;
} }
@mixin border-radius($radius) { @mixin {{ site.fontawesome.css_prefix }}-stack($width: 2em, $height: 2em, $top-font-size: 1em, $base-font-size: 2em) {
-webkit-border-radius: $radius; .{{ site.fontawesome.css_prefix }}-stack {
-moz-border-radius: $radius;
border-radius: $radius;
}
@mixin icon-stack($width: 2em, $height: 2em, $top-font-size: 1em, $base-font-size: 2em) {
.icon-stack {
position: relative; position: relative;
display: inline-block; display: inline-block;
width: $width; width: $width;
height: $height; height: $height;
line-height: $width; line-height: $width;
vertical-align: -35%; vertical-align: -35%;
[class^="icon-"], .{{ site.fontawesome.css_prefix }} {
[class*=" icon-"] {
position: absolute; position: absolute;
display: block; display: block;
width: 100%; width: 100%;
@ -42,9 +38,9 @@
*line-height: $height; *line-height: $height;
text-align: center; text-align: center;
} }
.icon-stack-base { .{{ site.fontawesome.css_prefix }}-stack-base {
font-size: $base-font-size; font-size: $base-font-size;
*line-height: #{$height / $base-font-size}em; *line-height: ($height / $base-font-size);
} }
} }
} }

View file

@ -3,12 +3,12 @@
@font-face { @font-face {
font-family: 'FontAwesome'; font-family: 'FontAwesome';
src: url('#{$FontAwesomePath}/fontawesome-webfont.eot?v=#{$FontAwesomeVersion}'); src: url('#{$fa-font-path}/fontawesome-webfont.eot?v=#{$fa-version}');
src: url('#{$FontAwesomePath}/fontawesome-webfont.eot?#iefix&v=#{$FontAwesomeVersion}') format('embedded-opentype'), src: url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
url('#{$FontAwesomePath}/fontawesome-webfont.woff?v=#{$FontAwesomeVersion}') format('woff'), url('#{$fa-font-path}/fontawesome-webfont.woff?v=#{$fa-version}') format('woff'),
url('#{$FontAwesomePath}/fontawesome-webfont.ttf?v=#{$FontAwesomeVersion}') format('truetype'), url('#{$fa-font-path}/fontawesome-webfont.ttf?v=#{$fa-version}') format('truetype'),
url('#{$FontAwesomePath}/fontawesome-webfont.svg?v=#{$FontAwesomeVersion}#fontawesomeregular') format('svg'); url('#{$fa-font-path}/fontawesome-webfont.svg?v=#{$fa-version}#fontawesomeregular') format('svg');
// src: url('#{$FontAwesomePath}/FontAwesome.otf') format('opentype'); // used when developing fonts //src: url('#{$fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }

View file

@ -3,14 +3,14 @@
// Variables // Variables
// -------------------------- // --------------------------
$FontAwesomePath: "../font" !default; $fa-font-path: "../fonts" !default;
$FontAwesomeVersion: "{{ site.fontawesome.version }}" !default; //$fa-font-path: "//netdna.bootstrapcdn.com/font-awesome/{{ site.fontawesome.version}}/font" !default; // for referencing Bootstrap CDN font files directly
$borderColor: #eeeeee !default; $fa-version: "{{ site.fontawesome.version }}" !default;
$iconMuted: #eeeeee !default; $fa-border-color: #eee !default;
$iconLight: white !default; $fa-icon-muted: #eee !default;
$iconDark: #333333 !default; $fa-icon-light: #fff !default;
$icons-li-width: (30em/14); $fa-icon-dark: #333 !default;
$fa-icon-li-width: (30em / 14);
{% for icon in icons %} {% for icon in icons %}${{ site.fontawesome.css_prefix }}-{{ icon.id }}: "\{{ icon.unicode }}";
${{ icon.id }}: "\{{ icon.unicode }}";
{% endfor %} {% endfor %}

View file

@ -6,6 +6,5 @@
@import "mixins"; @import "mixins";
@import "path"; @import "path";
@import "core"; @import "core";
@import "bootstrap";
@import "extras"; @import "extras";
@import "icons"; @import "icons";