core.less 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. /* FONT AWESOME CORE
  2. * -------------------------- */
  3. .fa-icon {
  4. .icon-FontAwesome();
  5. }
  6. /* makes the font 33% larger relative to the icon container */
  7. .fa-icon-lg {
  8. font-size: (4em / 3);
  9. line-height: (3em / 4);
  10. vertical-align: -15%;
  11. }
  12. /* increased font size for icon-lg */
  13. .fa-icon-fixed-width {
  14. width: (16em / 14);
  15. padding-right: (4em / 14);
  16. text-align: right;
  17. &.fa-icon-lg {
  18. width: (20em / 14);
  19. }
  20. }
  21. // Icon UL & LI
  22. // -------------------------
  23. .fa-icon-ul {
  24. padding-left: 0;
  25. margin-left: @icons-li-width;
  26. list-style-type: none;
  27. > li { position: relative; }
  28. }
  29. .fa-icon-li {
  30. position: absolute;
  31. left: -@icons-li-width;
  32. width: @icons-li-width;
  33. top: (2em / 14);
  34. text-align: center;
  35. &.fa-icon-lg {
  36. left: -@icons-li-width + (4em / 14);
  37. }
  38. }
  39. // allows usage of the hide class directly on font awesome icons
  40. .fa-icon.hide { display: none; }
  41. .fa-icon-muted { color: @iconMuted; }
  42. .fa-icon-light { color: @iconLight; }
  43. .fa-icon-dark { color: @iconDark; }
  44. // Icon Borders
  45. // -------------------------
  46. .fa-icon-border {
  47. padding: .2em .25em .15em;
  48. border: solid 1px @borderColor;
  49. .border-radius(3px);
  50. }
  51. // Icon Sizes
  52. // -------------------------
  53. .fa-icon-2x {
  54. font-size: 2em;
  55. &.fa-icon-border {
  56. border-width: 2px;
  57. .border-radius(4px);
  58. }
  59. }
  60. .fa-icon-3x {
  61. font-size: 3em;
  62. &.fa-icon-border {
  63. border-width: 3px;
  64. .border-radius(5px);
  65. }
  66. }
  67. .fa-icon-4x {
  68. font-size: 4em;
  69. &.fa-icon-border {
  70. border-width: 4px;
  71. .border-radius(6px);
  72. }
  73. }
  74. .fa-icon-5x {
  75. font-size: 5em;
  76. &.fa-icon-border {
  77. border-width: 5px;
  78. .border-radius(7px);
  79. }
  80. }
  81. // Floats & Margins
  82. // -------------------------
  83. // Quick floats
  84. .pull-right { float: right; }
  85. .pull-left { float: left; }
  86. .fa-icon {
  87. &.pull-left { margin-right: .3em; }
  88. &.pull-right { margin-left: .3em; }
  89. }