stylus.js 8.5 KB

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