less-rails-fontawesome 0.6.0 → 0.7.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,13 @@
1
+ // Icon Sizes
2
+ // -------------------------
3
+
4
+ /* makes the font 33% larger relative to the icon container */
5
+ .@{fa-css-prefix}-lg {
6
+ font-size: (4em / 3);
7
+ line-height: (3em / 4);
8
+ vertical-align: -15%;
9
+ }
10
+ .@{fa-css-prefix}-2x { font-size: 2em; }
11
+ .@{fa-css-prefix}-3x { font-size: 3em; }
12
+ .@{fa-css-prefix}-4x { font-size: 4em; }
13
+ .@{fa-css-prefix}-5x { font-size: 5em; }
@@ -0,0 +1,19 @@
1
+ // List Icons
2
+ // -------------------------
3
+
4
+ .@{fa-css-prefix}-ul {
5
+ padding-left: 0;
6
+ margin-left: @fa-li-width;
7
+ list-style-type: none;
8
+ > li { position: relative; }
9
+ }
10
+ .@{fa-css-prefix}-li {
11
+ position: absolute;
12
+ left: -@fa-li-width;
13
+ width: @fa-li-width;
14
+ top: (2em / 14);
15
+ text-align: center;
16
+ &.@{fa-css-prefix}-lg {
17
+ left: -@fa-li-width + (4em / 14);
18
+ }
19
+ }
@@ -1,48 +1,20 @@
1
1
  // Mixins
2
2
  // --------------------------
3
3
 
4
- .icon(@icon) {
5
- .icon-FontAwesome();
6
- content: @icon;
4
+ .fa-icon-rotate(@degrees, @rotation) {
5
+ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=@rotation);
6
+ -webkit-transform: rotate(@degrees);
7
+ -moz-transform: rotate(@degrees);
8
+ -ms-transform: rotate(@degrees);
9
+ -o-transform: rotate(@degrees);
10
+ transform: rotate(@degrees);
7
11
  }
8
12
 
9
- .icon-FontAwesome() {
10
- font-family: FontAwesome;
11
- font-weight: normal;
12
- font-style: normal;
13
- text-decoration: inherit;
14
- -webkit-font-smoothing: antialiased;
15
- *margin-right: .3em; // fixes ie7 issues
16
- }
17
-
18
- .border-radius(@radius) {
19
- -webkit-border-radius: @radius;
20
- -moz-border-radius: @radius;
21
- border-radius: @radius;
22
- }
23
-
24
- .icon-stack(@width: 2em, @height: 2em, @top-font-size: 1em, @base-font-size: 2em) {
25
- .icon-stack {
26
- position: relative;
27
- display: inline-block;
28
- width: @width;
29
- height: @height;
30
- line-height: @width;
31
- vertical-align: -35%;
32
- [class^="icon-"],
33
- [class*=" icon-"] {
34
- display: block;
35
- text-align: center;
36
- position: absolute;
37
- width: 100%;
38
- height: 100%;
39
- font-size: @top-font-size;
40
- line-height: inherit;
41
- *line-height: @height;
42
- }
43
- .icon-stack-base {
44
- font-size: @base-font-size;
45
- *line-height: @height / @base-font-size;
46
- }
47
- }
13
+ .fa-icon-flip(@horiz, @vert, @rotation) {
14
+ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=@rotation, mirror=1);
15
+ -webkit-transform: scale(@horiz, @vert);
16
+ -moz-transform: scale(@horiz, @vert);
17
+ -ms-transform: scale(@horiz, @vert);
18
+ -o-transform: scale(@horiz, @vert);
19
+ transform: scale(@horiz, @vert);
48
20
  }
@@ -12,3 +12,17 @@
12
12
  font-weight: normal;
13
13
  font-style: normal;
14
14
  }
15
+
16
+ /* check for a possible bug in parsing: 'fontawesome-webfont.woff?v=@{fa-version}'
17
+ @font-face {
18
+ font-family: 'FontAwesome';
19
+ src: '/assets/fontawesome-webfont.eot?v=@{fa-version}';
20
+ src: '/assets/fontawesome-webfont.eot?#iefix&v=@{fa-version}' format('embedded-opentype'),
21
+ '/assets/fontawesome-webfont.woff?v=@{fa-version}' format('woff'),
22
+ '/assets/fontawesome-webfont.ttf?v=@{fa-version}' format('truetype'),
23
+ '/assets/fontawesome-webfont.svg?v=@{fa-version}#fontawesomeregular' format('svg');
24
+ // src: url('@{fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts
25
+ font-weight: normal;
26
+ font-style: normal;
27
+ }
28
+ */
@@ -0,0 +1,9 @@
1
+ // Rotated & Flipped Icons
2
+ // -------------------------
3
+
4
+ .@{fa-css-prefix}-rotate-90 { .fa-icon-rotate(90deg, 1); }
5
+ .@{fa-css-prefix}-rotate-180 { .fa-icon-rotate(180deg, 2); }
6
+ .@{fa-css-prefix}-rotate-270 { .fa-icon-rotate(270deg, 3); }
7
+
8
+ .@{fa-css-prefix}-flip-horizontal { .fa-icon-flip(-1, 1, 0); }
9
+ .@{fa-css-prefix}-flip-vertical { .fa-icon-flip(1, -1, 2); }
@@ -0,0 +1,30 @@
1
+ // Spinning Icons
2
+ // --------------------------
3
+
4
+ .@{fa-css-prefix}-spin {
5
+ -webkit-animation: spin 2s infinite linear;
6
+ -moz-animation: spin 2s infinite linear;
7
+ -o-animation: spin 2s infinite linear;
8
+ animation: spin 2s infinite linear;
9
+ }
10
+
11
+ @-moz-keyframes spin {
12
+ 0% { -moz-transform: rotate(0deg); }
13
+ 100% { -moz-transform: rotate(359deg); }
14
+ }
15
+ @-webkit-keyframes spin {
16
+ 0% { -webkit-transform: rotate(0deg); }
17
+ 100% { -webkit-transform: rotate(359deg); }
18
+ }
19
+ @-o-keyframes spin {
20
+ 0% { -o-transform: rotate(0deg); }
21
+ 100% { -o-transform: rotate(359deg); }
22
+ }
23
+ @-ms-keyframes spin {
24
+ 0% { -ms-transform: rotate(0deg); }
25
+ 100% { -ms-transform: rotate(359deg); }
26
+ }
27
+ @keyframes spin {
28
+ 0% { transform: rotate(0deg); }
29
+ 100% { transform: rotate(359deg); }
30
+ }
@@ -0,0 +1,20 @@
1
+ // Stacked Icons
2
+ // -------------------------
3
+
4
+ .@{fa-css-prefix}-stack {
5
+ position: relative;
6
+ display: inline-block;
7
+ width: 2em;
8
+ height: 2em;
9
+ line-height: 2em;
10
+ vertical-align: middle;
11
+ }
12
+ .@{fa-css-prefix}-stack-1x, .@{fa-css-prefix}-stack-2x {
13
+ position: absolute;
14
+ left: 0;
15
+ width: 100%;
16
+ text-align: center;
17
+ }
18
+ .@{fa-css-prefix}-stack-1x { line-height: inherit; }
19
+ .@{fa-css-prefix}-stack-2x { font-size: 2em; }
20
+ .@{fa-css-prefix}-inverse { color: @fa-inverse; }