code.less 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. // Code.less
  2. // Code typography styles for the <code> and <pre> elements
  3. // --------------------------------------------------------
  4. // Inline and block code styles
  5. code,
  6. pre {
  7. padding: 0 3px 2px;
  8. #font > #family > .monospace;
  9. font-size: @baseFontSize - 1;
  10. color: @grayDark;
  11. .border-radius(3px);
  12. }
  13. // Inline code
  14. code {
  15. padding: 2px 4px;
  16. color: #d14;
  17. background-color: #f7f7f9;
  18. border: 1px solid #e1e1e8;
  19. }
  20. // Blocks of code
  21. pre {
  22. display: block;
  23. padding: (@baseLineHeight - 1) / 2;
  24. margin: 0 0 @baseLineHeight / 2;
  25. font-size: @baseFontSize * .925; // 13px to 12px
  26. line-height: @baseLineHeight;
  27. background-color: #f5f5f5;
  28. border: 1px solid #ccc; // fallback for IE7-8
  29. border: 1px solid rgba(0,0,0,.15);
  30. .border-radius(4px);
  31. white-space: pre;
  32. white-space: pre-wrap;
  33. word-break: break-all;
  34. word-wrap: break-word;
  35. // Make prettyprint styles more spaced out for readability
  36. &.prettyprint {
  37. margin-bottom: @baseLineHeight;
  38. }
  39. // Account for some code outputs that place code tags in pre tags
  40. code {
  41. padding: 0;
  42. color: inherit;
  43. background-color: transparent;
  44. border: 0;
  45. }
  46. }
  47. // Enable scrollable blocks of code
  48. .pre-scrollable {
  49. max-height: 340px;
  50. overflow-y: scroll;
  51. }