_markdown.scss 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. @import 'variables';
  2. $block-border-radius: 4px;
  3. .markdown {
  4. line-height: 1.7;
  5. margin-left: 12px;
  6. > :first-child {
  7. margin-top: 0;
  8. line-height: 1em;
  9. }
  10. h1:first-of-type {
  11. text-transform: capitalize;
  12. }
  13. h2 {
  14. margin-top: 48px;
  15. }
  16. h3 {
  17. margin-top: 36px;
  18. color: $gray-700;
  19. }
  20. h1, h2, h3, h4, h5 {
  21. font-weight: 600;
  22. line-height: 1.25;
  23. &[id]:target:before {
  24. display: block;
  25. content: " ";
  26. margin-top: -75px; // Set the Appropriate Height
  27. height: 75px; // Set the Appropriate Height
  28. visibility: hidden;
  29. }
  30. &[id]:target {
  31. text-decoration: underline;
  32. }
  33. }
  34. b, optgroup, strong {
  35. font-weight: 700;
  36. }
  37. a {
  38. text-decoration: none;
  39. &:hover {
  40. text-decoration: underline;
  41. }
  42. }
  43. code:not([data-lang]) {
  44. font-family: 'Oxygen Mono', monospace;
  45. padding: 0 $padding-4;
  46. background: $color-code-bg;
  47. color: $color-code-text;
  48. border-radius: $block-border-radius;
  49. border: 1px solid $color-code-border;
  50. }
  51. pre:not(.chroma) {
  52. padding: $padding-16;
  53. background: $color-code-bg;
  54. border-radius: $block-border-radius;
  55. font-size: $font-size-14;
  56. overflow-x: auto;
  57. code {
  58. color: $color-code-text;
  59. background: none;
  60. padding: none;
  61. }
  62. }
  63. blockquote {
  64. border-left: $padding-1*2 solid $gray-300;
  65. margin: 0;
  66. padding: $padding-1 $padding-16;
  67. :first-child { margin-top: 0; }
  68. :last-child { margin-bottom: 0; }
  69. }
  70. table tr td {
  71. padding: $padding-8;
  72. }
  73. }