FlandreScarle7/Font-Awesome
1
0
Fork 0
mirror of https://github.com/FortAwesome/Font-Awesome.git synced 2025-01-13 08:40:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

changed icon mixin to icon-full, added icon-lite mixin and .icon base class

Browse Source
This commit is contained in:
tquensen 2012-03-08 23:37:11 +01:00
parent 5ecbb6f2d1
commit 8c481a4ba2
1 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
less/font-awesome.less vendored
View File

@ -63,8 +63,19 @@ li[class*=" icon-"] {
} }
} }
//.icon mixin, adds an icon to any css selector //.icon base class to use with .icon-lite() mixin
.icon(@type, @size: 1, @color: inherit, @margin: 0.2em) { .icon {
&:before {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
display: inline-block;
vertical-align: middle;
text-align: center;
}
}
//.icon-full mixin, adds an icon to any css selector
.icon-full(@type, @size: 1, @color: inherit, @margin: 0.2em) {
&:before { &:before {
font-family: FontAwesome; font-family: FontAwesome;
font-weight: normal; font-weight: normal;
@ -81,6 +92,16 @@ li[class*=" icon-"] {
color: @color; color: @color;
} }
} }
//.icon-lite mixin, like .icon-full(), but less code and requires .icon class on all html elements that use it
.icon-lite(@type, @size: 1, @color: inherit, @margin: 0.2em) {
&:before {
margin-right: @margin;
content: @type;
font-size: @size * 1em;
line-height: 1em / @size;
color: @color;
}
}
// Uses Unicode Private Use Area (PUA) to ensure screen readers do not read off // Uses Unicode Private Use Area (PUA) to ensure screen readers do not read off
// random characters that represent icons // random characters that represent icons