title.sass 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. $title-color: $grey-darker !default
  2. $title-family: false !default
  3. $title-size: $size-3 !default
  4. $title-weight: $weight-semibold !default
  5. $title-line-height: 1.125 !default
  6. $title-strong-color: inherit !default
  7. $title-strong-weight: inherit !default
  8. $title-sub-size: 0.75em !default
  9. $title-sup-size: 0.75em !default
  10. $subtitle-color: $grey-dark !default
  11. $subtitle-family: false !default
  12. $subtitle-size: $size-5 !default
  13. $subtitle-weight: $weight-normal !default
  14. $subtitle-line-height: 1.25 !default
  15. $subtitle-strong-color: $grey-darker !default
  16. $subtitle-strong-weight: $weight-semibold !default
  17. $subtitle-negative-margin: -1.25rem !default
  18. .title,
  19. .subtitle
  20. @extend %block
  21. word-break: break-word
  22. em,
  23. span
  24. font-weight: inherit
  25. sub
  26. font-size: $title-sub-size
  27. sup
  28. font-size: $title-sup-size
  29. .tag
  30. vertical-align: middle
  31. .title
  32. color: $title-color
  33. @if $title-family
  34. font-family: $title-family
  35. font-size: $title-size
  36. font-weight: $title-weight
  37. line-height: $title-line-height
  38. strong
  39. color: $title-strong-color
  40. font-weight: $title-strong-weight
  41. & + .highlight
  42. margin-top: -0.75rem
  43. &:not(.is-spaced) + .subtitle
  44. margin-top: $subtitle-negative-margin
  45. // Sizes
  46. @each $size in $sizes
  47. $i: index($sizes, $size)
  48. &.is-#{$i}
  49. font-size: $size
  50. .subtitle
  51. color: $subtitle-color
  52. @if $subtitle-family
  53. font-family: $subtitle-family
  54. font-size: $subtitle-size
  55. font-weight: $subtitle-weight
  56. line-height: $subtitle-line-height
  57. strong
  58. color: $subtitle-strong-color
  59. font-weight: $subtitle-strong-weight
  60. &:not(.is-spaced) + .title
  61. margin-top: $subtitle-negative-margin
  62. // Sizes
  63. @each $size in $sizes
  64. $i: index($sizes, $size)
  65. &.is-#{$i}
  66. font-size: $size