helper.css 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. /* HELPER CLASS
  2. * -------------------------- */
  3. /* FA based classes */
  4. /*! Modified from font-awesome helper CSS classes - PIXEDEN
  5. * Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
  6. * License - http://fontawesome.io/license (CSS: MIT License)
  7. */
  8. /* makes the font 33% larger relative to the icon container */
  9. .pe-lg {
  10. font-size: 1.3333333333333333em;
  11. line-height: 0.75em;
  12. vertical-align: -15%;
  13. }
  14. .pe-2x {
  15. font-size: 2em;
  16. }
  17. .pe-3x {
  18. font-size: 3em;
  19. }
  20. .pe-4x {
  21. font-size: 4em;
  22. }
  23. .pe-5x {
  24. font-size: 5em;
  25. }
  26. .pe-fw {
  27. width: 1.2857142857142858em;
  28. text-align: center;
  29. }
  30. .pe-ul {
  31. padding-left: 0;
  32. margin-left: 2.142857142857143em;
  33. list-style-type: none;
  34. }
  35. .pe-ul > li {
  36. position: relative;
  37. }
  38. .pe-li {
  39. position: absolute;
  40. left: -2.142857142857143em;
  41. width: 2.142857142857143em;
  42. top: 0.14285714285714285em;
  43. text-align: center;
  44. }
  45. .pe-li.pe-lg {
  46. left: -1.8571428571428572em;
  47. }
  48. .pe-border {
  49. padding: .2em .25em .15em;
  50. border: solid 0.08em #eeeeee;
  51. border-radius: .1em;
  52. }
  53. .pull-right {
  54. float: right;
  55. }
  56. .pull-left {
  57. float: left;
  58. }
  59. .pe.pull-left {
  60. margin-right: .3em;
  61. }
  62. .pe.pull-right {
  63. margin-left: .3em;
  64. }
  65. .pe-spin {
  66. -webkit-animation: spin 2s infinite linear;
  67. -moz-animation: spin 2s infinite linear;
  68. -o-animation: spin 2s infinite linear;
  69. animation: spin 2s infinite linear;
  70. }
  71. @-moz-keyframes spin {
  72. 0% {
  73. -moz-transform: rotate(0deg);
  74. }
  75. 100% {
  76. -moz-transform: rotate(359deg);
  77. }
  78. }
  79. @-webkit-keyframes spin {
  80. 0% {
  81. -webkit-transform: rotate(0deg);
  82. }
  83. 100% {
  84. -webkit-transform: rotate(359deg);
  85. }
  86. }
  87. @-o-keyframes spin {
  88. 0% {
  89. -o-transform: rotate(0deg);
  90. }
  91. 100% {
  92. -o-transform: rotate(359deg);
  93. }
  94. }
  95. @-ms-keyframes spin {
  96. 0% {
  97. -ms-transform: rotate(0deg);
  98. }
  99. 100% {
  100. -ms-transform: rotate(359deg);
  101. }
  102. }
  103. @keyframes spin {
  104. 0% {
  105. transform: rotate(0deg);
  106. }
  107. 100% {
  108. transform: rotate(359deg);
  109. }
  110. }
  111. .pe-rotate-90 {
  112. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  113. -webkit-transform: rotate(90deg);
  114. -moz-transform: rotate(90deg);
  115. -ms-transform: rotate(90deg);
  116. -o-transform: rotate(90deg);
  117. transform: rotate(90deg);
  118. }
  119. .pe-rotate-180 {
  120. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  121. -webkit-transform: rotate(180deg);
  122. -moz-transform: rotate(180deg);
  123. -ms-transform: rotate(180deg);
  124. -o-transform: rotate(180deg);
  125. transform: rotate(180deg);
  126. }
  127. .pe-rotate-270 {
  128. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  129. -webkit-transform: rotate(270deg);
  130. -moz-transform: rotate(270deg);
  131. -ms-transform: rotate(270deg);
  132. -o-transform: rotate(270deg);
  133. transform: rotate(270deg);
  134. }
  135. .pe-flip-horizontal {
  136. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  137. -webkit-transform: scale(-1, 1);
  138. -moz-transform: scale(-1, 1);
  139. -ms-transform: scale(-1, 1);
  140. -o-transform: scale(-1, 1);
  141. transform: scale(-1, 1);
  142. }
  143. .pe-flip-vertical {
  144. filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  145. -webkit-transform: scale(1, -1);
  146. -moz-transform: scale(1, -1);
  147. -ms-transform: scale(1, -1);
  148. -o-transform: scale(1, -1);
  149. transform: scale(1, -1);
  150. }
  151. .pe-stack {
  152. position: relative;
  153. display: inline-block;
  154. width: 2em;
  155. height: 2em;
  156. line-height: 2em;
  157. vertical-align: middle;
  158. }
  159. .pe-stack-1x,
  160. .pe-stack-2x {
  161. position: absolute;
  162. left: 0;
  163. width: 100%;
  164. text-align: center;
  165. }
  166. .pe-stack-1x {
  167. line-height: inherit;
  168. }
  169. .pe-stack-2x {
  170. font-size: 2em;
  171. }
  172. .pe-inverse {
  173. color: #ffffff;
  174. }
  175. /* Custom classes / mods - PIXEDEN */
  176. .pe-va {
  177. vertical-align: middle;
  178. }
  179. .pe-border {
  180. border: solid 0.08em #eaeaea;
  181. }
  182. [class^="pe-7s-"], [class*=" pe-7s-"] {
  183. display: inline-block;
  184. }