font_awesome_rails_sass 0.0.1

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,84 @@
1
+ /* BOOTSTRAP SPECIFIC CLASSES
2
+ * -------------------------- */
3
+
4
+ // Bootstrap 2.0 sprites.less reset
5
+
6
+ [class^="icon-"],
7
+ [class*=" icon-"]
8
+ display: inline
9
+ width: auto
10
+ height: auto
11
+ line-height: normal
12
+ vertical-align: baseline
13
+ background-image: none
14
+ background-position: 0% 0%
15
+ background-repeat: repeat
16
+ margin-top: 0
17
+
18
+ // more sprites.less reset
19
+
20
+ .icon-white,
21
+ .nav-pills > .active > a > [class^="icon-"],
22
+ .nav-pills > .active > a > [class*=" icon-"],
23
+ .nav-list > .active > a > [class^="icon-"],
24
+ .nav-list > .active > a > [class*=" icon-"],
25
+ .navbar-inverse .nav > .active > a > [class^="icon-"],
26
+ .navbar-inverse .nav > .active > a > [class*=" icon-"],
27
+ .dropdown-menu > li > a:hover > [class^="icon-"],
28
+ .dropdown-menu > li > a:hover > [class*=" icon-"],
29
+ .dropdown-menu > .active > a > [class^="icon-"],
30
+ .dropdown-menu > .active > a > [class*=" icon-"],
31
+ .dropdown-submenu:hover > a > [class^="icon-"],
32
+ .dropdown-submenu:hover > a > [class*=" icon-"]
33
+ background-image: none
34
+
35
+ // keeps Bootstrap styles with and without icons the same
36
+ .btn, .nav
37
+ [class^="icon-"],
38
+ [class*=" icon-"]
39
+ // display: inline;
40
+ &.icon-large
41
+ line-height: .9em
42
+ &.icon-spin
43
+ display: inline-block
44
+
45
+ .nav-tabs, .nav-pills
46
+ [class^="icon-"],
47
+ [class*=" icon-"]
48
+ &, &.icon-large
49
+ line-height: .9em
50
+
51
+ .btn
52
+ [class^="icon-"],
53
+ [class*=" icon-"]
54
+ &.pull-left, &.pull-right
55
+ &.icon-2x
56
+ margin-top: .18em
57
+ &.icon-spin.icon-large
58
+ line-height: .8em
59
+
60
+ .btn.btn-small
61
+ [class^="icon-"],
62
+ [class*=" icon-"]
63
+ &.pull-left, &.pull-right
64
+ &.icon-2x
65
+ margin-top: .25em
66
+
67
+ .btn.btn-large
68
+ [class^="icon-"],
69
+ [class*=" icon-"]
70
+ margin-top: 0
71
+ // overrides bootstrap default
72
+ &.pull-left, &.pull-right
73
+ &.icon-2x
74
+ margin-top: .05em
75
+ &.pull-left.icon-2x
76
+ margin-right: .2em
77
+ &.pull-right.icon-2x
78
+ margin-left: .2em
79
+
80
+ // Fixes alignment in nav lists
81
+
82
+ .nav-list [class^="icon-"],
83
+ .nav-list [class*=" icon-"]
84
+ line-height: inherit
@@ -0,0 +1,115 @@
1
+ /* FONT AWESOME CORE
2
+ * -------------------------- */
3
+
4
+ [class^="icon-"],
5
+ [class*=" icon-"]
6
+ +icon-FontAwesome
7
+
8
+ [class^="icon-"]:before,
9
+ [class*=" icon-"]:before
10
+ text-decoration: inherit
11
+ display: inline-block
12
+ speak: none
13
+
14
+ // makes the font 33% larger relative to the icon container
15
+ .icon-large:before
16
+ vertical-align: -10%
17
+ font-size: (4em / 3)
18
+
19
+ // makes sure icons active on rollover in links
20
+ a
21
+ [class^="icon-"],
22
+ [class*=" icon-"]
23
+ display: inline
24
+
25
+ // increased font size for icon-large
26
+
27
+ [class^="icon-"],
28
+ [class*=" icon-"]
29
+ &.icon-fixed-width
30
+ display: inline-block
31
+ width: (16em / 14)
32
+ text-align: right
33
+ padding-right: (4em / 14)
34
+ &.icon-large
35
+ width: (20em / 14)
36
+
37
+ .icons-ul
38
+ margin-left: $icons-li-width
39
+ list-style-type: none
40
+ > li
41
+ position: relative
42
+ .icon-li
43
+ position: absolute
44
+ left: -$icons-li-width
45
+ width: $icons-li-width
46
+ text-align: center
47
+ line-height: inherit
48
+
49
+ // allows usage of the hide class directly on font awesome icons
50
+
51
+ [class^="icon-"],
52
+ [class*=" icon-"]
53
+ &.hide
54
+ display: none
55
+
56
+ .icon-muted
57
+ color: $iconMuted
58
+
59
+ .icon-light
60
+ color: $iconLight
61
+
62
+ .icon-dark
63
+ color: $iconDark
64
+
65
+ // Icon Borders
66
+ // -------------------------
67
+
68
+ .icon-border
69
+ border: solid 1px $borderColor
70
+ padding: .2em .25em .15em
71
+ +border-radius(3px)
72
+
73
+ // Icon Sizes
74
+ // -------------------------
75
+
76
+ .icon-2x
77
+ font-size: 2em
78
+ &.icon-border
79
+ border-width: 2px
80
+ +border-radius(4px)
81
+
82
+ .icon-3x
83
+ font-size: 3em
84
+ &.icon-border
85
+ border-width: 3px
86
+ +border-radius(5px)
87
+
88
+ .icon-4x
89
+ font-size: 4em
90
+ &.icon-border
91
+ border-width: 4px
92
+ +border-radius(6px)
93
+
94
+ .icon-5x
95
+ font-size: 5em
96
+ &.icon-border
97
+ border-width: 5px
98
+ +border-radius(7px)
99
+
100
+ // Floats & Margins
101
+ // -------------------------
102
+
103
+ // Quick floats
104
+ .pull-right
105
+ float: right
106
+
107
+ .pull-left
108
+ float: left
109
+
110
+ [class^="icon-"],
111
+ [class*=" icon-"]
112
+ &.pull-left
113
+ margin-right: .3em
114
+ &.pull-right
115
+ margin-left: .3em
@@ -0,0 +1,100 @@
1
+ /* EXTRAS
2
+ * -------------------------- */
3
+
4
+ // Stacked and layered icon
5
+ +icon-stack
6
+
7
+ // Animated rotating icon
8
+ .icon-spin
9
+ display: inline-block
10
+ -moz-animation: spin 2s infinite linear
11
+ -o-animation: spin 2s infinite linear
12
+ -webkit-animation: spin 2s infinite linear
13
+ animation: spin 2s infinite linear
14
+
15
+ // Prevent stack and spinners from being taken inline when inside a link
16
+
17
+ a .icon-stack,
18
+ a .icon-spin
19
+ display: inline-block
20
+ text-decoration: none
21
+
22
+ @-moz-keyframes spin
23
+ 0%
24
+ -moz-transform: rotate(0deg)
25
+ 100%
26
+ -moz-transform: rotate(359deg)
27
+
28
+
29
+ @-webkit-keyframes spin
30
+ 0%
31
+ -webkit-transform: rotate(0deg)
32
+ 100%
33
+ -webkit-transform: rotate(359deg)
34
+
35
+
36
+ @-o-keyframes spin
37
+ 0%
38
+ -o-transform: rotate(0deg)
39
+ 100%
40
+ -o-transform: rotate(359deg)
41
+
42
+
43
+ @-ms-keyframes spin
44
+ 0%
45
+ -ms-transform: rotate(0deg)
46
+ 100%
47
+ -ms-transform: rotate(359deg)
48
+
49
+
50
+ @keyframes spin
51
+ 0%
52
+ transform: rotate(0deg)
53
+ 100%
54
+ transform: rotate(359deg)
55
+
56
+
57
+ // Icon rotations and mirroring
58
+ .icon-rotate-90:before
59
+ -webkit-transform: rotate(90deg)
60
+ -moz-transform: rotate(90deg)
61
+ -ms-transform: rotate(90deg)
62
+ -o-transform: rotate(90deg)
63
+ transform: rotate(90deg)
64
+ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1)
65
+
66
+ .icon-rotate-180:before
67
+ -webkit-transform: rotate(180deg)
68
+ -moz-transform: rotate(180deg)
69
+ -ms-transform: rotate(180deg)
70
+ -o-transform: rotate(180deg)
71
+ transform: rotate(180deg)
72
+ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2)
73
+
74
+ .icon-rotate-270:before
75
+ -webkit-transform: rotate(270deg)
76
+ -moz-transform: rotate(270deg)
77
+ -ms-transform: rotate(270deg)
78
+ -o-transform: rotate(270deg)
79
+ transform: rotate(270deg)
80
+ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3)
81
+
82
+ .icon-flip-horizontal:before
83
+ -webkit-transform: scale(-1, 1)
84
+ -moz-transform: scale(-1, 1)
85
+ -ms-transform: scale(-1, 1)
86
+ -o-transform: scale(-1, 1)
87
+ transform: scale(-1, 1)
88
+
89
+ .icon-flip-vertical:before
90
+ -webkit-transform: scale(1, -1)
91
+ -moz-transform: scale(1, -1)
92
+ -ms-transform: scale(1, -1)
93
+ -o-transform: scale(1, -1)
94
+ transform: scale(1, -1)
95
+
96
+ // ensure rotation occurs inside anchor tags
97
+ a
98
+ .icon-rotate-90, .icon-rotate-180, .icon-rotate-270, .icon-flip-horizontal, .icon-flip-vertical
99
+ &:before
100
+ display: inline-block