_mdn.scss 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. ._mdn {
  2. .index { // HTML, CSS
  3. -webkit-columns: 16em;
  4. -moz-columns: 16em;
  5. columns: 16em;
  6. > span {
  7. display: block;
  8. font-size: 1rem;
  9. font-weight: $boldFontWeight;
  10. }
  11. ul, ol {
  12. margin: 0 0 1em;
  13. padding: 0;
  14. line-height: 1.5;
  15. list-style: none;
  16. }
  17. li { padding-left: 1em; }
  18. }
  19. > h2 { @extend %block-heading; }
  20. > h3 { @extend %block-label, %label-blue; }
  21. > h4 { font-size: 1em; }
  22. p > code, li > code { @extend %label; }
  23. > .note,
  24. .notice,
  25. .warning,
  26. .overheadIndicator,
  27. .syntaxbox, // CSS, JavaScript
  28. .twopartsyntaxbox, // CSS
  29. .inheritsbox, // JavaScript
  30. .eval:first-of-type { // JavaScript
  31. @extend %note;
  32. }
  33. .warning { @extend %note-red; }
  34. > .note {
  35. em {
  36. font-style: normal;
  37. font-weight: $boldFontWeight;
  38. }
  39. > ul { margin: 1em 0; }
  40. > p:last-child, > ul:last-child { margin-bottom: 0; }
  41. }
  42. .inlineIndicator {
  43. white-space: nowrap;
  44. @extend %label;
  45. }
  46. .syntaxbox a, // CSS
  47. .twopartsyntaxbox a, // CSS
  48. .inlineIndicator > a {
  49. color: inherit;
  50. @extend %internal-link;
  51. }
  52. .deprecated, .obsolete { @extend %label-red; }
  53. .nonStandard, .projectSpecific, .experimental { @extend %label-orange; }
  54. .htmlelt,
  55. .cssprop {
  56. display: table;
  57. @extend %note, %note-blue;
  58. > li {
  59. display: table-row;
  60. margin: 0;
  61. > dfn {
  62. display: table-cell;
  63. padding: .125rem 1.5rem .125rem 0;
  64. white-space: pre;
  65. border: 0;
  66. cursor: inherit;
  67. &:after { content: ':'; }
  68. }
  69. }
  70. th, td {
  71. background: none;
  72. border: 0;
  73. }
  74. }
  75. dt > strong > code, // HTML element attribute
  76. dl > dt > code { // CSS property value, Javascript function argument
  77. font-family: inherit;
  78. font-weight: $boldFontWeight;
  79. font-size: inherit;
  80. }
  81. .eventinfo { // DOM event
  82. > dd + dt { margin-top: 0; }
  83. }
  84. .cleared { clear: both; } // CSS/box-shadow
  85. code > strong { font-weight: normal; }
  86. }