_code.scss 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. //
  2. // Code (inline and blocK)
  3. // --------------------------------------------------
  4. // Inline and block code styles
  5. code,
  6. pre {
  7. @include font-family-monospace();
  8. font-size: $font-size-base - 2;
  9. background-color: $code-tag-bg;
  10. color: $text-color;
  11. border: 1px solid $code-tag-border;
  12. padding: 10px;
  13. border-radius: 4px;
  14. }
  15. // Inline code
  16. code {
  17. color: $text-color;
  18. background-color: $code-tag-bg;
  19. border: 1px solid darken($code-tag-bg, 15%);
  20. white-space: nowrap;
  21. padding: 2px 5px;
  22. margin: 0 2px;
  23. }
  24. code.code--small {
  25. font-size: $font-size-xs;
  26. padding: 5px;
  27. margin: 0 2px;
  28. }
  29. // Blocks of code
  30. pre {
  31. display: block;
  32. margin: 0 0 $line-height-base;
  33. line-height: $line-height-base;
  34. word-break: break-all;
  35. word-wrap: break-word;
  36. white-space: pre;
  37. white-space: pre-wrap;
  38. background-color: $code-tag-bg;
  39. // Make prettyprint styles more spaced out for readability
  40. &.prettyprint {
  41. margin-bottom: $line-height-base;
  42. }
  43. // Account for some code outputs that place code tags in pre tags
  44. code {
  45. padding: 0;
  46. color: inherit;
  47. white-space: pre;
  48. white-space: pre-wrap;
  49. background-color: transparent;
  50. border: 0;
  51. }
  52. }