utility.less 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. // Font Family
  2. // -------------------------
  3. .serif {
  4. font-family: @serifFontFamily;
  5. }
  6. .monospace {
  7. font-family: @monoFontFamily;
  8. }
  9. .text-sm {
  10. font-size: @fontSizeSmall;
  11. }
  12. .text-lg {
  13. font-size: @fontSizeLarge;
  14. }
  15. // Padding
  16. // -------------------------
  17. .padding {
  18. &-xs {
  19. padding: @padding-xs;
  20. &-horizontal {
  21. padding: 0 @padding-xs;
  22. }
  23. &-vertical {
  24. padding: @padding-xs 0;
  25. }
  26. &-top {
  27. padding-top: @padding-xs;
  28. }
  29. &-bottom {
  30. padding-bottom: @padding-xs;
  31. }
  32. &-left {
  33. padding-left: @padding-xs;
  34. }
  35. &-right {
  36. padding-right: @padding-xs;
  37. }
  38. }
  39. &-sm {
  40. padding: @padding-sm;
  41. &-horizontal {
  42. padding: 0 @padding-sm;
  43. }
  44. &-vertical {
  45. padding: @padding-sm 0;
  46. }
  47. &-top {
  48. padding-top: @padding-sm;
  49. }
  50. &-bottom {
  51. padding-bottom: @padding-sm;
  52. }
  53. &-left {
  54. padding-left: @padding-sm;
  55. }
  56. &-right {
  57. padding-right: @padding-sm;
  58. }
  59. }
  60. &-md {
  61. padding: @padding-md;
  62. &-horizontal {
  63. padding: 0 @padding-md;
  64. }
  65. &-vertical {
  66. padding: @padding-md 0;
  67. }
  68. &-top {
  69. padding-top: @padding-md;
  70. }
  71. &-bottom {
  72. padding-bottom: @padding-md;
  73. }
  74. &-left {
  75. padding-left: @padding-md;
  76. }
  77. &-right {
  78. padding-right: @padding-md;
  79. }
  80. }
  81. &-lg {
  82. padding: @padding-lg;
  83. &-horizontal {
  84. padding: 0 @padding-lg;
  85. }
  86. &-vertical {
  87. padding: @padding-lg 0;
  88. }
  89. &-top {
  90. padding-top: @padding-lg;
  91. }
  92. &-bottom {
  93. padding-bottom: @padding-lg;
  94. }
  95. &-left {
  96. padding-left: @padding-lg;
  97. }
  98. &-right {
  99. padding-right: @padding-lg;
  100. }
  101. }
  102. }
  103. // Margin
  104. // -------------------------
  105. .margin{
  106. &-xs {
  107. margin: @margin-xs;
  108. &-horizontal {
  109. margin: 0 @margin-xs;
  110. }
  111. &-vertical {
  112. margin: @margin-xs 0;
  113. }
  114. &-top {
  115. margin-top: @margin-xs;
  116. }
  117. &-bottom {
  118. margin-bottom: @margin-xs;
  119. }
  120. &-left {
  121. margin-left: @margin-xs;
  122. }
  123. &-right {
  124. margin-right: @margin-xs;
  125. }
  126. }
  127. &-sm {
  128. margin: @margin-sm;
  129. &-horizontal {
  130. margin: 0 @margin-sm;
  131. }
  132. &-vertical {
  133. margin: @margin-sm 0;
  134. }
  135. &-top {
  136. margin-top: @margin-sm;
  137. }
  138. &-bottom {
  139. margin-bottom: @margin-sm;
  140. }
  141. &-left {
  142. margin-left: @margin-sm;
  143. }
  144. &-right {
  145. margin-right: @margin-sm;
  146. }
  147. }
  148. &-md {
  149. margin: @margin-md;
  150. &-horizontal {
  151. margin: 0 @margin-md;
  152. }
  153. &-vertical {
  154. margin: @margin-md 0;
  155. }
  156. &-top {
  157. margin-top: @margin-md;
  158. }
  159. &-bottom {
  160. margin-bottom: @margin-md;
  161. }
  162. &-left {
  163. margin-left: @margin-md;
  164. }
  165. &-right {
  166. margin-right: @margin-md;
  167. }
  168. }
  169. &-lg {
  170. margin: @margin-lg;
  171. &-horizontal {
  172. margin: 0 @margin-lg;
  173. }
  174. &-vertical {
  175. margin: @margin-lg 0;
  176. }
  177. &-top {
  178. margin-top: @margin-lg;
  179. }
  180. &-bottom {
  181. margin-bottom: @margin-lg;
  182. }
  183. &-left {
  184. margin-left: @margin-lg;
  185. }
  186. &-right {
  187. margin-right: @margin-lg;
  188. }
  189. }
  190. }
  191. // Helpers
  192. // -------------------------
  193. .data-label {
  194. .data-label();
  195. }
  196. .data-value {
  197. .data-value();
  198. }
  199. .section-heading {
  200. .section-heading();
  201. }