stylus.js 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444
  1. module.exports = function(hljs) {
  2. var VARIABLE = {
  3. className: 'variable',
  4. begin: '\\$' + hljs.IDENT_RE
  5. };
  6. var HEX_COLOR = {
  7. className: 'number',
  8. begin: '#([a-fA-F0-9]{6}|[a-fA-F0-9]{3})'
  9. };
  10. var AT_KEYWORDS = [
  11. 'charset',
  12. 'css',
  13. 'debug',
  14. 'extend',
  15. 'font-face',
  16. 'for',
  17. 'import',
  18. 'include',
  19. 'media',
  20. 'mixin',
  21. 'page',
  22. 'warn',
  23. 'while'
  24. ];
  25. var PSEUDO_SELECTORS = [
  26. 'after',
  27. 'before',
  28. 'first-letter',
  29. 'first-line',
  30. 'active',
  31. 'first-child',
  32. 'focus',
  33. 'hover',
  34. 'lang',
  35. 'link',
  36. 'visited'
  37. ];
  38. var TAGS = [
  39. 'a',
  40. 'abbr',
  41. 'address',
  42. 'article',
  43. 'aside',
  44. 'audio',
  45. 'b',
  46. 'blockquote',
  47. 'body',
  48. 'button',
  49. 'canvas',
  50. 'caption',
  51. 'cite',
  52. 'code',
  53. 'dd',
  54. 'del',
  55. 'details',
  56. 'dfn',
  57. 'div',
  58. 'dl',
  59. 'dt',
  60. 'em',
  61. 'fieldset',
  62. 'figcaption',
  63. 'figure',
  64. 'footer',
  65. 'form',
  66. 'h1',
  67. 'h2',
  68. 'h3',
  69. 'h4',
  70. 'h5',
  71. 'h6',
  72. 'header',
  73. 'hgroup',
  74. 'html',
  75. 'i',
  76. 'iframe',
  77. 'img',
  78. 'input',
  79. 'ins',
  80. 'kbd',
  81. 'label',
  82. 'legend',
  83. 'li',
  84. 'mark',
  85. 'menu',
  86. 'nav',
  87. 'object',
  88. 'ol',
  89. 'p',
  90. 'q',
  91. 'quote',
  92. 'samp',
  93. 'section',
  94. 'span',
  95. 'strong',
  96. 'summary',
  97. 'sup',
  98. 'table',
  99. 'tbody',
  100. 'td',
  101. 'textarea',
  102. 'tfoot',
  103. 'th',
  104. 'thead',
  105. 'time',
  106. 'tr',
  107. 'ul',
  108. 'var',
  109. 'video'
  110. ];
  111. var LOOKAHEAD_TAG_END = '(?=[\\.\\s\\n\\[\\:,])';
  112. var ATTRIBUTES = [
  113. 'align-content',
  114. 'align-items',
  115. 'align-self',
  116. 'animation',
  117. 'animation-delay',
  118. 'animation-direction',
  119. 'animation-duration',
  120. 'animation-fill-mode',
  121. 'animation-iteration-count',
  122. 'animation-name',
  123. 'animation-play-state',
  124. 'animation-timing-function',
  125. 'auto',
  126. 'backface-visibility',
  127. 'background',
  128. 'background-attachment',
  129. 'background-clip',
  130. 'background-color',
  131. 'background-image',
  132. 'background-origin',
  133. 'background-position',
  134. 'background-repeat',
  135. 'background-size',
  136. 'border',
  137. 'border-bottom',
  138. 'border-bottom-color',
  139. 'border-bottom-left-radius',
  140. 'border-bottom-right-radius',
  141. 'border-bottom-style',
  142. 'border-bottom-width',
  143. 'border-collapse',
  144. 'border-color',
  145. 'border-image',
  146. 'border-image-outset',
  147. 'border-image-repeat',
  148. 'border-image-slice',
  149. 'border-image-source',
  150. 'border-image-width',
  151. 'border-left',
  152. 'border-left-color',
  153. 'border-left-style',
  154. 'border-left-width',
  155. 'border-radius',
  156. 'border-right',
  157. 'border-right-color',
  158. 'border-right-style',
  159. 'border-right-width',
  160. 'border-spacing',
  161. 'border-style',
  162. 'border-top',
  163. 'border-top-color',
  164. 'border-top-left-radius',
  165. 'border-top-right-radius',
  166. 'border-top-style',
  167. 'border-top-width',
  168. 'border-width',
  169. 'bottom',
  170. 'box-decoration-break',
  171. 'box-shadow',
  172. 'box-sizing',
  173. 'break-after',
  174. 'break-before',
  175. 'break-inside',
  176. 'caption-side',
  177. 'clear',
  178. 'clip',
  179. 'clip-path',
  180. 'color',
  181. 'column-count',
  182. 'column-fill',
  183. 'column-gap',
  184. 'column-rule',
  185. 'column-rule-color',
  186. 'column-rule-style',
  187. 'column-rule-width',
  188. 'column-span',
  189. 'column-width',
  190. 'columns',
  191. 'content',
  192. 'counter-increment',
  193. 'counter-reset',
  194. 'cursor',
  195. 'direction',
  196. 'display',
  197. 'empty-cells',
  198. 'filter',
  199. 'flex',
  200. 'flex-basis',
  201. 'flex-direction',
  202. 'flex-flow',
  203. 'flex-grow',
  204. 'flex-shrink',
  205. 'flex-wrap',
  206. 'float',
  207. 'font',
  208. 'font-family',
  209. 'font-feature-settings',
  210. 'font-kerning',
  211. 'font-language-override',
  212. 'font-size',
  213. 'font-size-adjust',
  214. 'font-stretch',
  215. 'font-style',
  216. 'font-variant',
  217. 'font-variant-ligatures',
  218. 'font-weight',
  219. 'height',
  220. 'hyphens',
  221. 'icon',
  222. 'image-orientation',
  223. 'image-rendering',
  224. 'image-resolution',
  225. 'ime-mode',
  226. 'inherit',
  227. 'initial',
  228. 'justify-content',
  229. 'left',
  230. 'letter-spacing',
  231. 'line-height',
  232. 'list-style',
  233. 'list-style-image',
  234. 'list-style-position',
  235. 'list-style-type',
  236. 'margin',
  237. 'margin-bottom',
  238. 'margin-left',
  239. 'margin-right',
  240. 'margin-top',
  241. 'marks',
  242. 'mask',
  243. 'max-height',
  244. 'max-width',
  245. 'min-height',
  246. 'min-width',
  247. 'nav-down',
  248. 'nav-index',
  249. 'nav-left',
  250. 'nav-right',
  251. 'nav-up',
  252. 'none',
  253. 'normal',
  254. 'object-fit',
  255. 'object-position',
  256. 'opacity',
  257. 'order',
  258. 'orphans',
  259. 'outline',
  260. 'outline-color',
  261. 'outline-offset',
  262. 'outline-style',
  263. 'outline-width',
  264. 'overflow',
  265. 'overflow-wrap',
  266. 'overflow-x',
  267. 'overflow-y',
  268. 'padding',
  269. 'padding-bottom',
  270. 'padding-left',
  271. 'padding-right',
  272. 'padding-top',
  273. 'page-break-after',
  274. 'page-break-before',
  275. 'page-break-inside',
  276. 'perspective',
  277. 'perspective-origin',
  278. 'pointer-events',
  279. 'position',
  280. 'quotes',
  281. 'resize',
  282. 'right',
  283. 'tab-size',
  284. 'table-layout',
  285. 'text-align',
  286. 'text-align-last',
  287. 'text-decoration',
  288. 'text-decoration-color',
  289. 'text-decoration-line',
  290. 'text-decoration-style',
  291. 'text-indent',
  292. 'text-overflow',
  293. 'text-rendering',
  294. 'text-shadow',
  295. 'text-transform',
  296. 'text-underline-position',
  297. 'top',
  298. 'transform',
  299. 'transform-origin',
  300. 'transform-style',
  301. 'transition',
  302. 'transition-delay',
  303. 'transition-duration',
  304. 'transition-property',
  305. 'transition-timing-function',
  306. 'unicode-bidi',
  307. 'vertical-align',
  308. 'visibility',
  309. 'white-space',
  310. 'widows',
  311. 'width',
  312. 'word-break',
  313. 'word-spacing',
  314. 'word-wrap',
  315. 'z-index'
  316. ];
  317. // illegals
  318. var ILLEGAL = [
  319. '\\?',
  320. '(\\bReturn\\b)', // monkey
  321. '(\\bEnd\\b)', // monkey
  322. '(\\bend\\b)', // vbscript
  323. '(\\bdef\\b)', // gradle
  324. ';', // a whole lot of languages
  325. '#\\s', // markdown
  326. '\\*\\s', // markdown
  327. '===\\s', // markdown
  328. '\\|',
  329. '%', // prolog
  330. ];
  331. return {
  332. aliases: ['styl'],
  333. case_insensitive: false,
  334. keywords: 'if else for in',
  335. illegal: '(' + ILLEGAL.join('|') + ')',
  336. contains: [
  337. // strings
  338. hljs.QUOTE_STRING_MODE,
  339. hljs.APOS_STRING_MODE,
  340. // comments
  341. hljs.C_LINE_COMMENT_MODE,
  342. hljs.C_BLOCK_COMMENT_MODE,
  343. // hex colors
  344. HEX_COLOR,
  345. // class tag
  346. {
  347. begin: '\\.[a-zA-Z][a-zA-Z0-9_-]*' + LOOKAHEAD_TAG_END,
  348. className: 'selector-class'
  349. },
  350. // id tag
  351. {
  352. begin: '\\#[a-zA-Z][a-zA-Z0-9_-]*' + LOOKAHEAD_TAG_END,
  353. className: 'selector-id'
  354. },
  355. // tags
  356. {
  357. begin: '\\b(' + TAGS.join('|') + ')' + LOOKAHEAD_TAG_END,
  358. className: 'selector-tag'
  359. },
  360. // psuedo selectors
  361. {
  362. begin: '&?:?:\\b(' + PSEUDO_SELECTORS.join('|') + ')' + LOOKAHEAD_TAG_END
  363. },
  364. // @ keywords
  365. {
  366. begin: '\@(' + AT_KEYWORDS.join('|') + ')\\b'
  367. },
  368. // variables
  369. VARIABLE,
  370. // dimension
  371. hljs.CSS_NUMBER_MODE,
  372. // number
  373. hljs.NUMBER_MODE,
  374. // functions
  375. // - only from beginning of line + whitespace
  376. {
  377. className: 'function',
  378. begin: '^[a-zA-Z][a-zA-Z0-9_\-]*\\(.*\\)',
  379. illegal: '[\\n]',
  380. returnBegin: true,
  381. contains: [
  382. {className: 'title', begin: '\\b[a-zA-Z][a-zA-Z0-9_\-]*'},
  383. {
  384. className: 'params',
  385. begin: /\(/,
  386. end: /\)/,
  387. contains: [
  388. HEX_COLOR,
  389. VARIABLE,
  390. hljs.APOS_STRING_MODE,
  391. hljs.CSS_NUMBER_MODE,
  392. hljs.NUMBER_MODE,
  393. hljs.QUOTE_STRING_MODE
  394. ]
  395. }
  396. ]
  397. },
  398. // attributes
  399. // - only from beginning of line + whitespace
  400. // - must have whitespace after it
  401. {
  402. className: 'attribute',
  403. begin: '\\b(' + ATTRIBUTES.reverse().join('|') + ')\\b',
  404. starts: {
  405. // value container
  406. end: /;|$/,
  407. contains: [
  408. HEX_COLOR,
  409. VARIABLE,
  410. hljs.APOS_STRING_MODE,
  411. hljs.QUOTE_STRING_MODE,
  412. hljs.CSS_NUMBER_MODE,
  413. hljs.NUMBER_MODE,
  414. hljs.C_BLOCK_COMMENT_MODE
  415. ],
  416. illegal: /\./,
  417. relevance: 0
  418. }
  419. }
  420. ]
  421. };
  422. };