css.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. /*
  2. Language: CSS
  3. Category: common, css
  4. Website: https://developer.mozilla.org/en-US/docs/Web/CSS
  5. */
  6. export default function (hljs) {
  7. var FUNCTION_LIKE = {
  8. begin: /[\w-]+\(/,
  9. returnBegin: true,
  10. contains: [
  11. {
  12. className: 'built_in',
  13. begin: /[\w-]+/
  14. },
  15. {
  16. begin: /\(/,
  17. end: /\)/,
  18. contains: [hljs.APOS_STRING_MODE, hljs.QUOTE_STRING_MODE, hljs.CSS_NUMBER_MODE]
  19. }
  20. ]
  21. };
  22. var ATTRIBUTE = {
  23. className: 'attribute',
  24. begin: /\S/,
  25. end: ':',
  26. excludeEnd: true,
  27. starts: {
  28. endsWithParent: true,
  29. excludeEnd: true,
  30. contains: [
  31. FUNCTION_LIKE,
  32. hljs.CSS_NUMBER_MODE,
  33. hljs.QUOTE_STRING_MODE,
  34. hljs.APOS_STRING_MODE,
  35. hljs.C_BLOCK_COMMENT_MODE,
  36. {
  37. className: 'number',
  38. begin: '#[0-9A-Fa-f]+'
  39. },
  40. {
  41. className: 'meta',
  42. begin: '!important'
  43. }
  44. ]
  45. }
  46. };
  47. var AT_IDENTIFIER = '@[a-z-]+'; // @font-face
  48. var AT_MODIFIERS = 'and or not only';
  49. var AT_PROPERTY_RE = /@\-?\w[\w]*(\-\w+)*/; // @-webkit-keyframes
  50. var IDENT_RE = '[a-zA-Z-][a-zA-Z0-9_-]*';
  51. var RULE = {
  52. begin: /(?:[A-Z\_\.\-]+|--[a-zA-Z0-9_-]+)\s*:/,
  53. returnBegin: true,
  54. end: ';',
  55. endsWithParent: true,
  56. contains: [ATTRIBUTE]
  57. };
  58. return {
  59. name: 'CSS',
  60. case_insensitive: true,
  61. illegal: /[=\/|'\$]/,
  62. contains: [
  63. hljs.C_BLOCK_COMMENT_MODE,
  64. {
  65. className: 'selector-id',
  66. begin: /#[A-Za-z0-9_-]+/
  67. },
  68. {
  69. className: 'selector-class',
  70. begin: /\.[A-Za-z0-9_-]+/
  71. },
  72. {
  73. className: 'selector-attr',
  74. begin: /\[/,
  75. end: /\]/,
  76. illegal: '$',
  77. contains: [hljs.APOS_STRING_MODE, hljs.QUOTE_STRING_MODE]
  78. },
  79. {
  80. className: 'selector-pseudo',
  81. begin: /:(:)?[a-zA-Z0-9\_\-\+\(\)"'.]+/
  82. },
  83. // matching these here allows us to treat them more like regular CSS
  84. // rules so everything between the {} gets regular rule highlighting,
  85. // which is what we want for page and font-face
  86. {
  87. begin: '@(page|font-face)',
  88. lexemes: AT_IDENTIFIER,
  89. keywords: '@page @font-face'
  90. },
  91. {
  92. begin: '@',
  93. end: '[{;]',
  94. // at_rule eating first "{" is a good thing
  95. // because it doesn’t let it to be parsed as
  96. // a rule set but instead drops parser into
  97. // the default mode which is how it should be.
  98. illegal: /:/,
  99. // break on Less variables @var: ...
  100. returnBegin: true,
  101. contains: [
  102. {
  103. className: 'keyword',
  104. begin: AT_PROPERTY_RE
  105. },
  106. {
  107. begin: /\s/,
  108. endsWithParent: true,
  109. excludeEnd: true,
  110. relevance: 0,
  111. keywords: AT_MODIFIERS,
  112. contains: [
  113. {
  114. begin: /[a-z-]+:/,
  115. className: 'attribute'
  116. },
  117. hljs.APOS_STRING_MODE,
  118. hljs.QUOTE_STRING_MODE,
  119. hljs.CSS_NUMBER_MODE
  120. ]
  121. }
  122. ]
  123. },
  124. {
  125. className: 'selector-tag',
  126. begin: IDENT_RE,
  127. relevance: 0
  128. },
  129. {
  130. begin: '{',
  131. end: '}',
  132. illegal: /\S/,
  133. contains: [hljs.C_BLOCK_COMMENT_MODE, RULE]
  134. }
  135. ]
  136. };
  137. }