mirror of
https://github.com/ForkAwesome/Fork-Awesome.git
synced 2024-12-26 21:41:31 +08:00
getting stacked and rotated moved over to new prefix
This commit is contained in:
parent
6ce5780b79
commit
676f6ad7b4
34
css/font-awesome.css
vendored
34
css/font-awesome.css
vendored
@ -254,7 +254,7 @@ a [class*=" fa-"] {
|
||||
/* EXTRAS
|
||||
* -------------------------- */
|
||||
/* Stacked and layered icon */
|
||||
.icon-stack {
|
||||
.fa-stack {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 2em;
|
||||
@ -262,8 +262,8 @@ a [class*=" fa-"] {
|
||||
line-height: 2em;
|
||||
vertical-align: -35%;
|
||||
}
|
||||
.icon-stack [class^="icon-"],
|
||||
.icon-stack [class*=" icon-"] {
|
||||
.fa-stack [class^="fa-"],
|
||||
.fa-stack [class*=" fa-"] {
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 100%;
|
||||
@ -273,12 +273,12 @@ a [class*=" fa-"] {
|
||||
*line-height: 2em;
|
||||
text-align: center;
|
||||
}
|
||||
.icon-stack .icon-stack-base {
|
||||
.fa-stack .fa-stack-base {
|
||||
font-size: 2em;
|
||||
*line-height: 1em;
|
||||
}
|
||||
/* Animated rotating icon */
|
||||
.icon-spin {
|
||||
.fa-spin {
|
||||
display: inline-block;
|
||||
-webkit-animation: spin 2s infinite linear;
|
||||
-moz-animation: spin 2s infinite linear;
|
||||
@ -286,8 +286,8 @@ a [class*=" fa-"] {
|
||||
animation: spin 2s infinite linear;
|
||||
}
|
||||
/* Prevent stack and spinners from being taken inline when inside a link */
|
||||
a .icon-stack,
|
||||
a .icon-spin {
|
||||
a .fa-stack,
|
||||
a .fa-spin {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -332,7 +332,7 @@ a .icon-spin {
|
||||
}
|
||||
}
|
||||
/* Icon rotations and mirroring */
|
||||
.icon-rotate-90:before {
|
||||
.fa-rotate-90:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
|
||||
-webkit-transform: rotate(90deg);
|
||||
-moz-transform: rotate(90deg);
|
||||
@ -340,7 +340,7 @@ a .icon-spin {
|
||||
-o-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
.icon-rotate-180:before {
|
||||
.fa-rotate-180:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
|
||||
-webkit-transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
@ -348,7 +348,7 @@ a .icon-spin {
|
||||
-o-transform: rotate(180deg);
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.icon-rotate-270:before {
|
||||
.fa-rotate-270:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
|
||||
-webkit-transform: rotate(270deg);
|
||||
-moz-transform: rotate(270deg);
|
||||
@ -356,14 +356,14 @@ a .icon-spin {
|
||||
-o-transform: rotate(270deg);
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
.icon-flip-horizontal:before {
|
||||
.fa-flip-horizontal: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);
|
||||
}
|
||||
.icon-flip-vertical:before {
|
||||
.fa-flip-vertical:before {
|
||||
-webkit-transform: scale(1, -1);
|
||||
-moz-transform: scale(1, -1);
|
||||
-ms-transform: scale(1, -1);
|
||||
@ -371,11 +371,11 @@ a .icon-spin {
|
||||
transform: scale(1, -1);
|
||||
}
|
||||
/* ensure rotation occurs inside anchor tags */
|
||||
a .icon-rotate-90:before,
|
||||
a .icon-rotate-180:before,
|
||||
a .icon-rotate-270:before,
|
||||
a .icon-flip-horizontal:before,
|
||||
a .icon-flip-vertical:before {
|
||||
a .fa-rotate-90:before,
|
||||
a .fa-rotate-180:before,
|
||||
a .fa-rotate-270:before,
|
||||
a .fa-flip-horizontal:before,
|
||||
a .fa-flip-vertical:before {
|
||||
display: inline-block;
|
||||
}
|
||||
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
|
||||
|
20
css/font-awesome.min.css
vendored
20
css/font-awesome.min.css
vendored
@ -30,16 +30,16 @@ a [class^="fa-"],a [class*=" fa-"]{display:inline;}
|
||||
.btn.btn-large [class^="fa-"].pull-left.fa-2x,.btn.btn-large [class*=" fa-"].pull-left.fa-2x{margin-right:.2em;}
|
||||
.btn.btn-large [class^="fa-"].pull-right.fa-2x,.btn.btn-large [class*=" fa-"].pull-right.fa-2x{margin-left:.2em;}
|
||||
.nav-list [class^="fa-"],.nav-list [class*=" fa-"]{line-height:inherit;}
|
||||
.icon-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:-35%;}.icon-stack [class^="icon-"],.icon-stack [class*=" icon-"]{position:absolute;display:block;width:100%;height:100%;font-size:1em;line-height:inherit;*line-height:2em;text-align:center;}
|
||||
.icon-stack .icon-stack-base{font-size:2em;*line-height:1em;}
|
||||
.icon-spin{display:inline-block;-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear;}
|
||||
a .icon-stack,a .icon-spin{display:inline-block;text-decoration:none;}
|
||||
@-moz-keyframes spin{0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(359deg);}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);} 100%{-webkit-transform:rotate(359deg);}}@-o-keyframes spin{0%{-o-transform:rotate(0deg);} 100%{-o-transform:rotate(359deg);}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg);} 100%{-ms-transform:rotate(359deg);}}@keyframes spin{0%{transform:rotate(0deg);} 100%{transform:rotate(359deg);}}.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{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{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg);}
|
||||
.icon-flip-horizontal: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);}
|
||||
.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);}
|
||||
a .icon-rotate-90:before,a .icon-rotate-180:before,a .icon-rotate-270:before,a .icon-flip-horizontal:before,a .icon-flip-vertical:before{display:inline-block;}
|
||||
.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:-35%;}.fa-stack [class^="fa-"],.fa-stack [class*=" fa-"]{position:absolute;display:block;width:100%;height:100%;font-size:1em;line-height:inherit;*line-height:2em;text-align:center;}
|
||||
.fa-stack .fa-stack-base{font-size:2em;*line-height:1em;}
|
||||
.fa-spin{display:inline-block;-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear;}
|
||||
a .fa-stack,a .fa-spin{display:inline-block;text-decoration:none;}
|
||||
@-moz-keyframes spin{0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(359deg);}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);} 100%{-webkit-transform:rotate(359deg);}}@-o-keyframes spin{0%{-o-transform:rotate(0deg);} 100%{-o-transform:rotate(359deg);}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg);} 100%{-ms-transform:rotate(359deg);}}@keyframes spin{0%{transform:rotate(0deg);} 100%{transform:rotate(359deg);}}.fa-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);}
|
||||
.fa-rotate-180:before{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);}
|
||||
.fa-rotate-270:before{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg);}
|
||||
.fa-flip-horizontal: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);}
|
||||
.fa-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);}
|
||||
a .fa-rotate-90:before,a .fa-rotate-180:before,a .fa-rotate-270:before,a .fa-flip-horizontal:before,a .fa-flip-vertical:before{display:inline-block;}
|
||||
.fa-glass:before{content:"\f000";}
|
||||
.fa-music:before{content:"\f001";}
|
||||
.fa-search:before{content:"\f002";}
|
||||
|
@ -5,7 +5,7 @@
|
||||
.icon-stack();
|
||||
|
||||
/* Animated rotating icon */
|
||||
.icon-spin {
|
||||
.fa-spin {
|
||||
display: inline-block;
|
||||
-webkit-animation: spin 2s infinite linear;
|
||||
-moz-animation: spin 2s infinite linear;
|
||||
@ -14,8 +14,8 @@
|
||||
}
|
||||
|
||||
/* Prevent stack and spinners from being taken inline when inside a link */
|
||||
a .icon-stack,
|
||||
a .icon-spin {
|
||||
a .fa-stack,
|
||||
a .fa-spin {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -42,7 +42,7 @@ a .icon-spin {
|
||||
}
|
||||
|
||||
/* Icon rotations and mirroring */
|
||||
.icon-rotate-90:before {
|
||||
.fa-rotate-90:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
|
||||
-webkit-transform: rotate(90deg);
|
||||
-moz-transform: rotate(90deg);
|
||||
@ -51,7 +51,7 @@ a .icon-spin {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.icon-rotate-180:before {
|
||||
.fa-rotate-180:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
|
||||
-webkit-transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
@ -60,7 +60,7 @@ a .icon-spin {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.icon-rotate-270:before {
|
||||
.fa-rotate-270:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
|
||||
-webkit-transform: rotate(270deg);
|
||||
-moz-transform: rotate(270deg);
|
||||
@ -69,7 +69,7 @@ a .icon-spin {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
.icon-flip-horizontal:before {
|
||||
.fa-flip-horizontal:before {
|
||||
-webkit-transform: scale(-1, 1);
|
||||
-moz-transform: scale(-1, 1);
|
||||
-ms-transform: scale(-1, 1);
|
||||
@ -77,7 +77,7 @@ a .icon-spin {
|
||||
transform: scale(-1, 1);
|
||||
}
|
||||
|
||||
.icon-flip-vertical:before {
|
||||
.fa-flip-vertical:before {
|
||||
-webkit-transform: scale(1, -1);
|
||||
-moz-transform: scale(1, -1);
|
||||
-ms-transform: scale(1, -1);
|
||||
@ -87,7 +87,7 @@ a .icon-spin {
|
||||
|
||||
/* ensure rotation occurs inside anchor tags */
|
||||
a {
|
||||
.icon-rotate-90, .icon-rotate-180, .icon-rotate-270, .icon-flip-horizontal, .icon-flip-vertical {
|
||||
.fa-rotate-90, .fa-rotate-180, .fa-rotate-270, .fa-flip-horizontal, .fa-flip-vertical {
|
||||
&:before { display: inline-block; }
|
||||
}
|
||||
}
|
||||
|
@ -24,15 +24,15 @@
|
||||
}
|
||||
|
||||
.icon-stack(@width: 2em, @height: 2em, @top-font-size: 1em, @base-font-size: 2em) {
|
||||
.icon-stack {
|
||||
.fa-stack {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: @width;
|
||||
height: @height;
|
||||
line-height: @width;
|
||||
vertical-align: -35%;
|
||||
[class^="icon-"],
|
||||
[class*=" icon-"] {
|
||||
[class^="fa-"],
|
||||
[class*=" fa-"] {
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 100%;
|
||||
@ -42,7 +42,7 @@
|
||||
*line-height: @height;
|
||||
text-align: center;
|
||||
}
|
||||
.icon-stack-base {
|
||||
.fa-stack-base {
|
||||
font-size: @base-font-size;
|
||||
*line-height: (@height / @base-font-size);
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
<a href="#"><i class="icon-flag"></i> normal</a><br>
|
||||
<a href="#"><i class="icon-flag icon-rotate-90"></i> icon-rotate-90</a><br>
|
||||
<a href="#"><i class="icon-flag icon-rotate-180"></i> icon-rotate-180</a><br>
|
||||
<a href="#"><i class="icon-flag icon-rotate-270"></i> icon-rotate-270</a><br>
|
||||
<a href="#"><i class="icon-flag icon-flip-horizontal"></i> icon-flip-horizontal</a><br>
|
||||
<a href="#"><i class="icon-flag icon-flip-vertical"></i> icon-flip-vertical</a>
|
||||
<a href="#"><i class="fa fa-flag"></i> normal</a><br>
|
||||
<a href="#"><i class="fa fa-flag fa-rotate-90"></i> fa-rotate-90</a><br>
|
||||
<a href="#"><i class="fa fa-flag fa-rotate-180"></i> fa-rotate-180</a><br>
|
||||
<a href="#"><i class="fa fa-flag fa-rotate-270"></i> fa-rotate-270</a><br>
|
||||
<a href="#"><i class="fa fa-flag fa-flip-horizontal"></i> fa-flip-horizontal</a><br>
|
||||
<a href="#"><i class="fa fa-flag fa-flip-vertical"></i> fa-flip-vertical</a>
|
||||
|
@ -1,6 +1,6 @@
|
||||
<a class="btn" href="#"><i class="icon-flag"></i> normal</a><br>
|
||||
<a class="btn" href="#"><i class="icon-flag icon-rotate-90"></i> icon-rotate-90</a><br>
|
||||
<a class="btn" href="#"><i class="icon-flag icon-rotate-180"></i> icon-rotate-180</a><br>
|
||||
<a class="btn" href="#"><i class="icon-flag icon-rotate-270"></i> icon-rotate-270</a><br>
|
||||
<a class="btn" href="#"><i class="icon-flag icon-flip-horizontal"></i> icon-flip-horizontal</a><br>
|
||||
<a class="btn" href="#"><i class="icon-flag icon-flip-vertical"></i> icon-flip-vertical</a>
|
||||
<a class="btn" href="#"><i class="fa fa-flag"></i> normal</a><br>
|
||||
<a class="btn" href="#"><i class="fa fa-flag fa-rotate-90"></i> fa-rotate-90</a><br>
|
||||
<a class="btn" href="#"><i class="fa fa-flag fa-rotate-180"></i> fa-rotate-180</a><br>
|
||||
<a class="btn" href="#"><i class="fa fa-flag fa-rotate-270"></i> fa-rotate-270</a><br>
|
||||
<a class="btn" href="#"><i class="fa fa-flag fa-flip-horizontal"></i> fa-flip-horizontal</a><br>
|
||||
<a class="btn" href="#"><i class="fa fa-flag fa-flip-vertical"></i> fa-flip-vertical</a>
|
||||
|
@ -1,6 +1,6 @@
|
||||
<i class="icon-flag"></i> normal<br>
|
||||
<i class="icon-flag icon-rotate-90"></i> icon-rotate-90<br>
|
||||
<i class="icon-flag icon-rotate-180"></i> icon-rotate-180<br>
|
||||
<i class="icon-flag icon-rotate-270"></i> icon-rotate-270<br>
|
||||
<i class="icon-flag icon-flip-horizontal"></i> icon-flip-horizontal<br>
|
||||
<i class="icon-flag icon-flip-vertical"></i> icon-flip-vertical
|
||||
<i class="fa fa-flag"></i> normal<br>
|
||||
<i class="fa fa-flag fa-rotate-90"></i> fa-rotate-90<br>
|
||||
<i class="fa fa-flag fa-rotate-180"></i> fa-rotate-180<br>
|
||||
<i class="fa fa-flag fa-rotate-270"></i> fa-rotate-270<br>
|
||||
<i class="fa fa-flag fa-flip-horizontal"></i> fa-flip-horizontal<br>
|
||||
<i class="fa fa-flag fa-flip-vertical"></i> fa-flip-vertical
|
||||
|
@ -1,68 +1,68 @@
|
||||
<p>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-sign-blank icon-stack-base"></i>
|
||||
<i class="icon-twitter icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-sign-blank fa-stack-base"></i>
|
||||
<i class="fa fa-twitter fa-light"></i>
|
||||
</span>
|
||||
Twitter Icon
|
||||
</a>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-sign-blank icon-stack-base"></i>
|
||||
<i class="icon-facebook icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-sign-blank fa-stack-base"></i>
|
||||
<i class="fa fa-facebook fa-light"></i>
|
||||
</span>
|
||||
Facebook Icon
|
||||
</a>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-sign-blank icon-stack-base"></i>
|
||||
<i class="icon-github icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-sign-blank fa-stack-base"></i>
|
||||
<i class="fa fa-github fa-light"></i>
|
||||
</span>
|
||||
GitHub Icon
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle icon-stack-base"></i>
|
||||
<i class="icon-twitter icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle fa-stack-base"></i>
|
||||
<i class="fa fa-twitter fa-light"></i>
|
||||
</span>
|
||||
Twitter Icon
|
||||
</a>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle icon-stack-base"></i>
|
||||
<i class="icon-facebook icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle fa-stack-base"></i>
|
||||
<i class="fa fa-facebook fa-light"></i>
|
||||
</span>
|
||||
Facebook Icon
|
||||
</a>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle icon-stack-base"></i>
|
||||
<i class="icon-github icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle fa-stack-base"></i>
|
||||
<i class="fa fa-github fa-light"></i>
|
||||
</span>
|
||||
GitHub Icon
|
||||
</a>
|
||||
</p>
|
||||
<p>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle-blank icon-stack-base"></i>
|
||||
<i class="icon-twitter"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle-blank fa-stack-base"></i>
|
||||
<i class="fa fa-twitter"></i>
|
||||
</span>
|
||||
Twitter Icon
|
||||
</a>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle-blank icon-stack-base"></i>
|
||||
<i class="icon-facebook"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle-blank fa-stack-base"></i>
|
||||
<i class="fa fa-facebook"></i>
|
||||
</span>
|
||||
Facebook Icon
|
||||
</a>
|
||||
<a href="#">
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle-blank icon-stack-base"></i>
|
||||
<i class="icon-github"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle-blank fa-stack-base"></i>
|
||||
<i class="fa fa-github"></i>
|
||||
</span>
|
||||
GitHub Icon
|
||||
</a>
|
||||
|
@ -1,51 +1,51 @@
|
||||
<p>
|
||||
<span class="icon-stack">
|
||||
<i class="icon-sign-blank icon-stack-base"></i>
|
||||
<i class="icon-twitter icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-sign-blank fa-stack-base"></i>
|
||||
<i class="fa fa-twitter fa-light"></i>
|
||||
</span>
|
||||
Twitter Icon
|
||||
<span class="icon-stack">
|
||||
<i class="icon-sign-blank icon-stack-base"></i>
|
||||
<i class="icon-facebook icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-sign-blank fa-stack-base"></i>
|
||||
<i class="fa fa-facebook fa-light"></i>
|
||||
</span>
|
||||
Facebook Icon
|
||||
<span class="icon-stack">
|
||||
<i class="icon-sign-blank icon-stack-base"></i>
|
||||
<i class="icon-github icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-sign-blank fa-stack-base"></i>
|
||||
<i class="fa fa-github fa-light"></i>
|
||||
</span>
|
||||
GitHub Icon
|
||||
</p>
|
||||
<p>
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle icon-stack-base"></i>
|
||||
<i class="icon-twitter icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle fa-stack-base"></i>
|
||||
<i class="fa fa-twitter fa-light"></i>
|
||||
</span>
|
||||
Twitter Icon
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle icon-stack-base"></i>
|
||||
<i class="icon-facebook icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle fa-stack-base"></i>
|
||||
<i class="fa fa-facebook fa-light"></i>
|
||||
</span>
|
||||
Facebook Icon
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle icon-stack-base"></i>
|
||||
<i class="icon-github icon-light"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle fa-stack-base"></i>
|
||||
<i class="fa fa-github fa-light"></i>
|
||||
</span>
|
||||
GitHub Icon
|
||||
</p>
|
||||
<p>
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle-blank icon-stack-base"></i>
|
||||
<i class="icon-twitter"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle-blank fa-stack-base"></i>
|
||||
<i class="fa fa-twitter"></i>
|
||||
</span>
|
||||
Twitter Icon
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle-blank icon-stack-base"></i>
|
||||
<i class="icon-facebook"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle-blank fa-stack-base"></i>
|
||||
<i class="fa fa-facebook"></i>
|
||||
</span>
|
||||
Facebook Icon
|
||||
<span class="icon-stack">
|
||||
<i class="icon-circle-blank icon-stack-base"></i>
|
||||
<i class="icon-github"></i>
|
||||
<span class="fa-stack">
|
||||
<i class="fa fa-circle-blank fa-stack-base"></i>
|
||||
<i class="fa fa-github"></i>
|
||||
</span>
|
||||
GitHub Icon
|
||||
</p>
|
18
src/assets/font-awesome/less/extras.less
vendored
18
src/assets/font-awesome/less/extras.less
vendored
@ -5,7 +5,7 @@
|
||||
.icon-stack();
|
||||
|
||||
/* Animated rotating icon */
|
||||
.icon-spin {
|
||||
.fa-spin {
|
||||
display: inline-block;
|
||||
-webkit-animation: spin 2s infinite linear;
|
||||
-moz-animation: spin 2s infinite linear;
|
||||
@ -14,8 +14,8 @@
|
||||
}
|
||||
|
||||
/* Prevent stack and spinners from being taken inline when inside a link */
|
||||
a .icon-stack,
|
||||
a .icon-spin {
|
||||
a .fa-stack,
|
||||
a .fa-spin {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -42,7 +42,7 @@ a .icon-spin {
|
||||
}
|
||||
|
||||
/* Icon rotations and mirroring */
|
||||
.icon-rotate-90:before {
|
||||
.fa-rotate-90:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
|
||||
-webkit-transform: rotate(90deg);
|
||||
-moz-transform: rotate(90deg);
|
||||
@ -51,7 +51,7 @@ a .icon-spin {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.icon-rotate-180:before {
|
||||
.fa-rotate-180:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
|
||||
-webkit-transform: rotate(180deg);
|
||||
-moz-transform: rotate(180deg);
|
||||
@ -60,7 +60,7 @@ a .icon-spin {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.icon-rotate-270:before {
|
||||
.fa-rotate-270:before {
|
||||
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
|
||||
-webkit-transform: rotate(270deg);
|
||||
-moz-transform: rotate(270deg);
|
||||
@ -69,7 +69,7 @@ a .icon-spin {
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
.icon-flip-horizontal:before {
|
||||
.fa-flip-horizontal:before {
|
||||
-webkit-transform: scale(-1, 1);
|
||||
-moz-transform: scale(-1, 1);
|
||||
-ms-transform: scale(-1, 1);
|
||||
@ -77,7 +77,7 @@ a .icon-spin {
|
||||
transform: scale(-1, 1);
|
||||
}
|
||||
|
||||
.icon-flip-vertical:before {
|
||||
.fa-flip-vertical:before {
|
||||
-webkit-transform: scale(1, -1);
|
||||
-moz-transform: scale(1, -1);
|
||||
-ms-transform: scale(1, -1);
|
||||
@ -87,7 +87,7 @@ a .icon-spin {
|
||||
|
||||
/* ensure rotation occurs inside anchor tags */
|
||||
a {
|
||||
.icon-rotate-90, .icon-rotate-180, .icon-rotate-270, .icon-flip-horizontal, .icon-flip-vertical {
|
||||
.fa-rotate-90, .fa-rotate-180, .fa-rotate-270, .fa-flip-horizontal, .fa-flip-vertical {
|
||||
&:before { display: inline-block; }
|
||||
}
|
||||
}
|
||||
|
8
src/assets/font-awesome/less/mixins.less
vendored
8
src/assets/font-awesome/less/mixins.less
vendored
@ -24,15 +24,15 @@
|
||||
}
|
||||
|
||||
.icon-stack(@width: 2em, @height: 2em, @top-font-size: 1em, @base-font-size: 2em) {
|
||||
.icon-stack {
|
||||
.fa-stack {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: @width;
|
||||
height: @height;
|
||||
line-height: @width;
|
||||
vertical-align: -35%;
|
||||
[class^="icon-"],
|
||||
[class*=" icon-"] {
|
||||
[class^="fa-"],
|
||||
[class*=" fa-"] {
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 100%;
|
||||
@ -42,7 +42,7 @@
|
||||
*line-height: @height;
|
||||
text-align: center;
|
||||
}
|
||||
.icon-stack-base {
|
||||
.fa-stack-base {
|
||||
font-size: @base-font-size;
|
||||
*line-height: (@height / @base-font-size);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user