content.sass 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. $content-heading-color: $text-strong !default
  2. $content-heading-weight: $weight-semibold !default
  3. $content-heading-line-height: 1.125 !default
  4. $content-blockquote-background-color: $background !default
  5. $content-blockquote-border-left: 5px solid $border !default
  6. $content-blockquote-padding: 1.25em 1.5em !default
  7. $content-pre-padding: 1.25em 1.5em !default
  8. $content-table-cell-border: 1px solid $border !default
  9. $content-table-cell-border-width: 0 0 1px !default
  10. $content-table-cell-padding: 0.5em 0.75em !default
  11. $content-table-cell-heading-color: $text-strong !default
  12. $content-table-head-cell-border-width: 0 0 2px !default
  13. $content-table-head-cell-color: $text-strong !default
  14. $content-table-foot-cell-border-width: 2px 0 0 !default
  15. $content-table-foot-cell-color: $text-strong !default
  16. .content
  17. @extend %block
  18. // Inline
  19. li + li
  20. margin-top: 0.25em
  21. // Block
  22. p,
  23. dl,
  24. ol,
  25. ul,
  26. blockquote,
  27. pre,
  28. table
  29. &:not(:last-child)
  30. margin-bottom: 1em
  31. h1,
  32. h2,
  33. h3,
  34. h4,
  35. h5,
  36. h6
  37. color: $content-heading-color
  38. font-weight: $content-heading-weight
  39. line-height: $content-heading-line-height
  40. h1
  41. font-size: 2em
  42. margin-bottom: 0.5em
  43. &:not(:first-child)
  44. margin-top: 1em
  45. h2
  46. font-size: 1.75em
  47. margin-bottom: 0.5714em
  48. &:not(:first-child)
  49. margin-top: 1.1428em
  50. h3
  51. font-size: 1.5em
  52. margin-bottom: 0.6666em
  53. &:not(:first-child)
  54. margin-top: 1.3333em
  55. h4
  56. font-size: 1.25em
  57. margin-bottom: 0.8em
  58. h5
  59. font-size: 1.125em
  60. margin-bottom: 0.8888em
  61. h6
  62. font-size: 1em
  63. margin-bottom: 1em
  64. blockquote
  65. background-color: $content-blockquote-background-color
  66. border-left: $content-blockquote-border-left
  67. padding: $content-blockquote-padding
  68. ol
  69. list-style-position: outside
  70. margin-left: 2em
  71. margin-top: 1em
  72. &:not([type])
  73. list-style-type: decimal
  74. &.is-lower-alpha
  75. list-style-type: lower-alpha
  76. &.is-lower-roman
  77. list-style-type: lower-roman
  78. &.is-upper-alpha
  79. list-style-type: upper-alpha
  80. &.is-upper-roman
  81. list-style-type: upper-roman
  82. ul
  83. list-style: disc outside
  84. margin-left: 2em
  85. margin-top: 1em
  86. ul
  87. list-style-type: circle
  88. margin-top: 0.5em
  89. ul
  90. list-style-type: square
  91. dd
  92. margin-left: 2em
  93. figure
  94. margin-left: 2em
  95. margin-right: 2em
  96. text-align: center
  97. &:not(:first-child)
  98. margin-top: 2em
  99. &:not(:last-child)
  100. margin-bottom: 2em
  101. img
  102. display: inline-block
  103. figcaption
  104. font-style: italic
  105. pre
  106. +overflow-touch
  107. overflow-x: auto
  108. padding: $content-pre-padding
  109. white-space: pre
  110. word-wrap: normal
  111. sup,
  112. sub
  113. font-size: 75%
  114. table
  115. width: 100%
  116. td,
  117. th
  118. border: $content-table-cell-border
  119. border-width: $content-table-cell-border-width
  120. padding: $content-table-cell-padding
  121. vertical-align: top
  122. th
  123. color: $content-table-cell-heading-color
  124. &:not([align])
  125. text-align: left
  126. thead
  127. td,
  128. th
  129. border-width: $content-table-head-cell-border-width
  130. color: $content-table-head-cell-color
  131. tfoot
  132. td,
  133. th
  134. border-width: $content-table-foot-cell-border-width
  135. color: $content-table-foot-cell-color
  136. tbody
  137. tr
  138. &:last-child
  139. td,
  140. th
  141. border-bottom-width: 0
  142. .tabs
  143. li + li
  144. margin-top: 0
  145. // Sizes
  146. &.is-small
  147. font-size: $size-small
  148. &.is-medium
  149. font-size: $size-medium
  150. &.is-large
  151. font-size: $size-large