_typography.scss 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384
  1. body {
  2. -webkit-font-smoothing: antialiased; // Do not remove!
  3. font-family: $font-sans;
  4. font-size: 85%;
  5. line-height: 1.5em;
  6. color: $color-text-base;
  7. }
  8. h1,
  9. h2,
  10. h3,
  11. h4,
  12. h5,
  13. h6 {
  14. font-weight: normal;
  15. line-height: theme('lineHeight.tight');
  16. color: theme('colors.primary.DEFAULT');
  17. }
  18. h1 {
  19. font-size: 1.5em;
  20. font-weight: 700;
  21. span {
  22. font-weight: 300;
  23. }
  24. }
  25. h2 {
  26. font-size: 1.3em;
  27. font-weight: 600;
  28. }
  29. p {
  30. margin-top: 0;
  31. }
  32. a {
  33. color: $color-link;
  34. text-decoration: none;
  35. &:hover {
  36. color: $color-link-hover;
  37. }
  38. }
  39. code {
  40. box-shadow: inset 0 0 4px 0 theme('colors.black-20');
  41. background-color: $color-white;
  42. font-family: $font-mono;
  43. padding: 2px 5px;
  44. }
  45. kbd {
  46. border-radius: 3px;
  47. font-family: $font-sans;
  48. border: 1px solid $color-grey-2;
  49. border-color: theme('colors.black-20');
  50. padding: 0.3em 0.5em;
  51. }
  52. pre {
  53. font-family: $font-mono;
  54. }
  55. dl,
  56. dt,
  57. dd {
  58. padding: 0;
  59. margin: 0;
  60. }
  61. dl {
  62. margin-top: 1em;
  63. }
  64. dt {
  65. color: $color-grey-2;
  66. font-size: 0.9em;
  67. }
  68. dd {
  69. margin-bottom: 1em;
  70. }