Mercurial

comparison third_party/highlight/languages/css.js @ 173:827c6ac504cd hg-web

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Merged in default here.
author MrJuneJune <me@mrjunejune.com>
date Mon, 19 Jan 2026 18:59:10 -0800
parents 2db6253f355d
children
comparison
equal deleted inserted replaced
151:c033667da5f9 173:827c6ac504cd
1 /*! `css` grammar compiled for Highlight.js 11.11.1 */
2 (function(){
3 var hljsGrammar = (function () {
4 'use strict';
5
6 const MODES = (hljs) => {
7 return {
8 IMPORTANT: {
9 scope: 'meta',
10 begin: '!important'
11 },
12 BLOCK_COMMENT: hljs.C_BLOCK_COMMENT_MODE,
13 HEXCOLOR: {
14 scope: 'number',
15 begin: /#(([0-9a-fA-F]{3,4})|(([0-9a-fA-F]{2}){3,4}))\b/
16 },
17 FUNCTION_DISPATCH: {
18 className: "built_in",
19 begin: /[\w-]+(?=\()/
20 },
21 ATTRIBUTE_SELECTOR_MODE: {
22 scope: 'selector-attr',
23 begin: /\[/,
24 end: /\]/,
25 illegal: '$',
26 contains: [
27 hljs.APOS_STRING_MODE,
28 hljs.QUOTE_STRING_MODE
29 ]
30 },
31 CSS_NUMBER_MODE: {
32 scope: 'number',
33 begin: hljs.NUMBER_RE + '(' +
34 '%|em|ex|ch|rem' +
35 '|vw|vh|vmin|vmax' +
36 '|cm|mm|in|pt|pc|px' +
37 '|deg|grad|rad|turn' +
38 '|s|ms' +
39 '|Hz|kHz' +
40 '|dpi|dpcm|dppx' +
41 ')?',
42 relevance: 0
43 },
44 CSS_VARIABLE: {
45 className: "attr",
46 begin: /--[A-Za-z_][A-Za-z0-9_-]*/
47 }
48 };
49 };
50
51 const HTML_TAGS = [
52 'a',
53 'abbr',
54 'address',
55 'article',
56 'aside',
57 'audio',
58 'b',
59 'blockquote',
60 'body',
61 'button',
62 'canvas',
63 'caption',
64 'cite',
65 'code',
66 'dd',
67 'del',
68 'details',
69 'dfn',
70 'div',
71 'dl',
72 'dt',
73 'em',
74 'fieldset',
75 'figcaption',
76 'figure',
77 'footer',
78 'form',
79 'h1',
80 'h2',
81 'h3',
82 'h4',
83 'h5',
84 'h6',
85 'header',
86 'hgroup',
87 'html',
88 'i',
89 'iframe',
90 'img',
91 'input',
92 'ins',
93 'kbd',
94 'label',
95 'legend',
96 'li',
97 'main',
98 'mark',
99 'menu',
100 'nav',
101 'object',
102 'ol',
103 'optgroup',
104 'option',
105 'p',
106 'picture',
107 'q',
108 'quote',
109 'samp',
110 'section',
111 'select',
112 'source',
113 'span',
114 'strong',
115 'summary',
116 'sup',
117 'table',
118 'tbody',
119 'td',
120 'textarea',
121 'tfoot',
122 'th',
123 'thead',
124 'time',
125 'tr',
126 'ul',
127 'var',
128 'video'
129 ];
130
131 const SVG_TAGS = [
132 'defs',
133 'g',
134 'marker',
135 'mask',
136 'pattern',
137 'svg',
138 'switch',
139 'symbol',
140 'feBlend',
141 'feColorMatrix',
142 'feComponentTransfer',
143 'feComposite',
144 'feConvolveMatrix',
145 'feDiffuseLighting',
146 'feDisplacementMap',
147 'feFlood',
148 'feGaussianBlur',
149 'feImage',
150 'feMerge',
151 'feMorphology',
152 'feOffset',
153 'feSpecularLighting',
154 'feTile',
155 'feTurbulence',
156 'linearGradient',
157 'radialGradient',
158 'stop',
159 'circle',
160 'ellipse',
161 'image',
162 'line',
163 'path',
164 'polygon',
165 'polyline',
166 'rect',
167 'text',
168 'use',
169 'textPath',
170 'tspan',
171 'foreignObject',
172 'clipPath'
173 ];
174
175 const TAGS = [
176 ...HTML_TAGS,
177 ...SVG_TAGS,
178 ];
179
180 // Sorting, then reversing makes sure longer attributes/elements like
181 // `font-weight` are matched fully instead of getting false positives on say `font`
182
183 const MEDIA_FEATURES = [
184 'any-hover',
185 'any-pointer',
186 'aspect-ratio',
187 'color',
188 'color-gamut',
189 'color-index',
190 'device-aspect-ratio',
191 'device-height',
192 'device-width',
193 'display-mode',
194 'forced-colors',
195 'grid',
196 'height',
197 'hover',
198 'inverted-colors',
199 'monochrome',
200 'orientation',
201 'overflow-block',
202 'overflow-inline',
203 'pointer',
204 'prefers-color-scheme',
205 'prefers-contrast',
206 'prefers-reduced-motion',
207 'prefers-reduced-transparency',
208 'resolution',
209 'scan',
210 'scripting',
211 'update',
212 'width',
213 // TODO: find a better solution?
214 'min-width',
215 'max-width',
216 'min-height',
217 'max-height'
218 ].sort().reverse();
219
220 // https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes
221 const PSEUDO_CLASSES = [
222 'active',
223 'any-link',
224 'blank',
225 'checked',
226 'current',
227 'default',
228 'defined',
229 'dir', // dir()
230 'disabled',
231 'drop',
232 'empty',
233 'enabled',
234 'first',
235 'first-child',
236 'first-of-type',
237 'fullscreen',
238 'future',
239 'focus',
240 'focus-visible',
241 'focus-within',
242 'has', // has()
243 'host', // host or host()
244 'host-context', // host-context()
245 'hover',
246 'indeterminate',
247 'in-range',
248 'invalid',
249 'is', // is()
250 'lang', // lang()
251 'last-child',
252 'last-of-type',
253 'left',
254 'link',
255 'local-link',
256 'not', // not()
257 'nth-child', // nth-child()
258 'nth-col', // nth-col()
259 'nth-last-child', // nth-last-child()
260 'nth-last-col', // nth-last-col()
261 'nth-last-of-type', //nth-last-of-type()
262 'nth-of-type', //nth-of-type()
263 'only-child',
264 'only-of-type',
265 'optional',
266 'out-of-range',
267 'past',
268 'placeholder-shown',
269 'read-only',
270 'read-write',
271 'required',
272 'right',
273 'root',
274 'scope',
275 'target',
276 'target-within',
277 'user-invalid',
278 'valid',
279 'visited',
280 'where' // where()
281 ].sort().reverse();
282
283 // https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-elements
284 const PSEUDO_ELEMENTS = [
285 'after',
286 'backdrop',
287 'before',
288 'cue',
289 'cue-region',
290 'first-letter',
291 'first-line',
292 'grammar-error',
293 'marker',
294 'part',
295 'placeholder',
296 'selection',
297 'slotted',
298 'spelling-error'
299 ].sort().reverse();
300
301 const ATTRIBUTES = [
302 'accent-color',
303 'align-content',
304 'align-items',
305 'align-self',
306 'alignment-baseline',
307 'all',
308 'anchor-name',
309 'animation',
310 'animation-composition',
311 'animation-delay',
312 'animation-direction',
313 'animation-duration',
314 'animation-fill-mode',
315 'animation-iteration-count',
316 'animation-name',
317 'animation-play-state',
318 'animation-range',
319 'animation-range-end',
320 'animation-range-start',
321 'animation-timeline',
322 'animation-timing-function',
323 'appearance',
324 'aspect-ratio',
325 'backdrop-filter',
326 'backface-visibility',
327 'background',
328 'background-attachment',
329 'background-blend-mode',
330 'background-clip',
331 'background-color',
332 'background-image',
333 'background-origin',
334 'background-position',
335 'background-position-x',
336 'background-position-y',
337 'background-repeat',
338 'background-size',
339 'baseline-shift',
340 'block-size',
341 'border',
342 'border-block',
343 'border-block-color',
344 'border-block-end',
345 'border-block-end-color',
346 'border-block-end-style',
347 'border-block-end-width',
348 'border-block-start',
349 'border-block-start-color',
350 'border-block-start-style',
351 'border-block-start-width',
352 'border-block-style',
353 'border-block-width',
354 'border-bottom',
355 'border-bottom-color',
356 'border-bottom-left-radius',
357 'border-bottom-right-radius',
358 'border-bottom-style',
359 'border-bottom-width',
360 'border-collapse',
361 'border-color',
362 'border-end-end-radius',
363 'border-end-start-radius',
364 'border-image',
365 'border-image-outset',
366 'border-image-repeat',
367 'border-image-slice',
368 'border-image-source',
369 'border-image-width',
370 'border-inline',
371 'border-inline-color',
372 'border-inline-end',
373 'border-inline-end-color',
374 'border-inline-end-style',
375 'border-inline-end-width',
376 'border-inline-start',
377 'border-inline-start-color',
378 'border-inline-start-style',
379 'border-inline-start-width',
380 'border-inline-style',
381 'border-inline-width',
382 'border-left',
383 'border-left-color',
384 'border-left-style',
385 'border-left-width',
386 'border-radius',
387 'border-right',
388 'border-right-color',
389 'border-right-style',
390 'border-right-width',
391 'border-spacing',
392 'border-start-end-radius',
393 'border-start-start-radius',
394 'border-style',
395 'border-top',
396 'border-top-color',
397 'border-top-left-radius',
398 'border-top-right-radius',
399 'border-top-style',
400 'border-top-width',
401 'border-width',
402 'bottom',
403 'box-align',
404 'box-decoration-break',
405 'box-direction',
406 'box-flex',
407 'box-flex-group',
408 'box-lines',
409 'box-ordinal-group',
410 'box-orient',
411 'box-pack',
412 'box-shadow',
413 'box-sizing',
414 'break-after',
415 'break-before',
416 'break-inside',
417 'caption-side',
418 'caret-color',
419 'clear',
420 'clip',
421 'clip-path',
422 'clip-rule',
423 'color',
424 'color-interpolation',
425 'color-interpolation-filters',
426 'color-profile',
427 'color-rendering',
428 'color-scheme',
429 'column-count',
430 'column-fill',
431 'column-gap',
432 'column-rule',
433 'column-rule-color',
434 'column-rule-style',
435 'column-rule-width',
436 'column-span',
437 'column-width',
438 'columns',
439 'contain',
440 'contain-intrinsic-block-size',
441 'contain-intrinsic-height',
442 'contain-intrinsic-inline-size',
443 'contain-intrinsic-size',
444 'contain-intrinsic-width',
445 'container',
446 'container-name',
447 'container-type',
448 'content',
449 'content-visibility',
450 'counter-increment',
451 'counter-reset',
452 'counter-set',
453 'cue',
454 'cue-after',
455 'cue-before',
456 'cursor',
457 'cx',
458 'cy',
459 'direction',
460 'display',
461 'dominant-baseline',
462 'empty-cells',
463 'enable-background',
464 'field-sizing',
465 'fill',
466 'fill-opacity',
467 'fill-rule',
468 'filter',
469 'flex',
470 'flex-basis',
471 'flex-direction',
472 'flex-flow',
473 'flex-grow',
474 'flex-shrink',
475 'flex-wrap',
476 'float',
477 'flood-color',
478 'flood-opacity',
479 'flow',
480 'font',
481 'font-display',
482 'font-family',
483 'font-feature-settings',
484 'font-kerning',
485 'font-language-override',
486 'font-optical-sizing',
487 'font-palette',
488 'font-size',
489 'font-size-adjust',
490 'font-smooth',
491 'font-smoothing',
492 'font-stretch',
493 'font-style',
494 'font-synthesis',
495 'font-synthesis-position',
496 'font-synthesis-small-caps',
497 'font-synthesis-style',
498 'font-synthesis-weight',
499 'font-variant',
500 'font-variant-alternates',
501 'font-variant-caps',
502 'font-variant-east-asian',
503 'font-variant-emoji',
504 'font-variant-ligatures',
505 'font-variant-numeric',
506 'font-variant-position',
507 'font-variation-settings',
508 'font-weight',
509 'forced-color-adjust',
510 'gap',
511 'glyph-orientation-horizontal',
512 'glyph-orientation-vertical',
513 'grid',
514 'grid-area',
515 'grid-auto-columns',
516 'grid-auto-flow',
517 'grid-auto-rows',
518 'grid-column',
519 'grid-column-end',
520 'grid-column-start',
521 'grid-gap',
522 'grid-row',
523 'grid-row-end',
524 'grid-row-start',
525 'grid-template',
526 'grid-template-areas',
527 'grid-template-columns',
528 'grid-template-rows',
529 'hanging-punctuation',
530 'height',
531 'hyphenate-character',
532 'hyphenate-limit-chars',
533 'hyphens',
534 'icon',
535 'image-orientation',
536 'image-rendering',
537 'image-resolution',
538 'ime-mode',
539 'initial-letter',
540 'initial-letter-align',
541 'inline-size',
542 'inset',
543 'inset-area',
544 'inset-block',
545 'inset-block-end',
546 'inset-block-start',
547 'inset-inline',
548 'inset-inline-end',
549 'inset-inline-start',
550 'isolation',
551 'justify-content',
552 'justify-items',
553 'justify-self',
554 'kerning',
555 'left',
556 'letter-spacing',
557 'lighting-color',
558 'line-break',
559 'line-height',
560 'line-height-step',
561 'list-style',
562 'list-style-image',
563 'list-style-position',
564 'list-style-type',
565 'margin',
566 'margin-block',
567 'margin-block-end',
568 'margin-block-start',
569 'margin-bottom',
570 'margin-inline',
571 'margin-inline-end',
572 'margin-inline-start',
573 'margin-left',
574 'margin-right',
575 'margin-top',
576 'margin-trim',
577 'marker',
578 'marker-end',
579 'marker-mid',
580 'marker-start',
581 'marks',
582 'mask',
583 'mask-border',
584 'mask-border-mode',
585 'mask-border-outset',
586 'mask-border-repeat',
587 'mask-border-slice',
588 'mask-border-source',
589 'mask-border-width',
590 'mask-clip',
591 'mask-composite',
592 'mask-image',
593 'mask-mode',
594 'mask-origin',
595 'mask-position',
596 'mask-repeat',
597 'mask-size',
598 'mask-type',
599 'masonry-auto-flow',
600 'math-depth',
601 'math-shift',
602 'math-style',
603 'max-block-size',
604 'max-height',
605 'max-inline-size',
606 'max-width',
607 'min-block-size',
608 'min-height',
609 'min-inline-size',
610 'min-width',
611 'mix-blend-mode',
612 'nav-down',
613 'nav-index',
614 'nav-left',
615 'nav-right',
616 'nav-up',
617 'none',
618 'normal',
619 'object-fit',
620 'object-position',
621 'offset',
622 'offset-anchor',
623 'offset-distance',
624 'offset-path',
625 'offset-position',
626 'offset-rotate',
627 'opacity',
628 'order',
629 'orphans',
630 'outline',
631 'outline-color',
632 'outline-offset',
633 'outline-style',
634 'outline-width',
635 'overflow',
636 'overflow-anchor',
637 'overflow-block',
638 'overflow-clip-margin',
639 'overflow-inline',
640 'overflow-wrap',
641 'overflow-x',
642 'overflow-y',
643 'overlay',
644 'overscroll-behavior',
645 'overscroll-behavior-block',
646 'overscroll-behavior-inline',
647 'overscroll-behavior-x',
648 'overscroll-behavior-y',
649 'padding',
650 'padding-block',
651 'padding-block-end',
652 'padding-block-start',
653 'padding-bottom',
654 'padding-inline',
655 'padding-inline-end',
656 'padding-inline-start',
657 'padding-left',
658 'padding-right',
659 'padding-top',
660 'page',
661 'page-break-after',
662 'page-break-before',
663 'page-break-inside',
664 'paint-order',
665 'pause',
666 'pause-after',
667 'pause-before',
668 'perspective',
669 'perspective-origin',
670 'place-content',
671 'place-items',
672 'place-self',
673 'pointer-events',
674 'position',
675 'position-anchor',
676 'position-visibility',
677 'print-color-adjust',
678 'quotes',
679 'r',
680 'resize',
681 'rest',
682 'rest-after',
683 'rest-before',
684 'right',
685 'rotate',
686 'row-gap',
687 'ruby-align',
688 'ruby-position',
689 'scale',
690 'scroll-behavior',
691 'scroll-margin',
692 'scroll-margin-block',
693 'scroll-margin-block-end',
694 'scroll-margin-block-start',
695 'scroll-margin-bottom',
696 'scroll-margin-inline',
697 'scroll-margin-inline-end',
698 'scroll-margin-inline-start',
699 'scroll-margin-left',
700 'scroll-margin-right',
701 'scroll-margin-top',
702 'scroll-padding',
703 'scroll-padding-block',
704 'scroll-padding-block-end',
705 'scroll-padding-block-start',
706 'scroll-padding-bottom',
707 'scroll-padding-inline',
708 'scroll-padding-inline-end',
709 'scroll-padding-inline-start',
710 'scroll-padding-left',
711 'scroll-padding-right',
712 'scroll-padding-top',
713 'scroll-snap-align',
714 'scroll-snap-stop',
715 'scroll-snap-type',
716 'scroll-timeline',
717 'scroll-timeline-axis',
718 'scroll-timeline-name',
719 'scrollbar-color',
720 'scrollbar-gutter',
721 'scrollbar-width',
722 'shape-image-threshold',
723 'shape-margin',
724 'shape-outside',
725 'shape-rendering',
726 'speak',
727 'speak-as',
728 'src', // @font-face
729 'stop-color',
730 'stop-opacity',
731 'stroke',
732 'stroke-dasharray',
733 'stroke-dashoffset',
734 'stroke-linecap',
735 'stroke-linejoin',
736 'stroke-miterlimit',
737 'stroke-opacity',
738 'stroke-width',
739 'tab-size',
740 'table-layout',
741 'text-align',
742 'text-align-all',
743 'text-align-last',
744 'text-anchor',
745 'text-combine-upright',
746 'text-decoration',
747 'text-decoration-color',
748 'text-decoration-line',
749 'text-decoration-skip',
750 'text-decoration-skip-ink',
751 'text-decoration-style',
752 'text-decoration-thickness',
753 'text-emphasis',
754 'text-emphasis-color',
755 'text-emphasis-position',
756 'text-emphasis-style',
757 'text-indent',
758 'text-justify',
759 'text-orientation',
760 'text-overflow',
761 'text-rendering',
762 'text-shadow',
763 'text-size-adjust',
764 'text-transform',
765 'text-underline-offset',
766 'text-underline-position',
767 'text-wrap',
768 'text-wrap-mode',
769 'text-wrap-style',
770 'timeline-scope',
771 'top',
772 'touch-action',
773 'transform',
774 'transform-box',
775 'transform-origin',
776 'transform-style',
777 'transition',
778 'transition-behavior',
779 'transition-delay',
780 'transition-duration',
781 'transition-property',
782 'transition-timing-function',
783 'translate',
784 'unicode-bidi',
785 'user-modify',
786 'user-select',
787 'vector-effect',
788 'vertical-align',
789 'view-timeline',
790 'view-timeline-axis',
791 'view-timeline-inset',
792 'view-timeline-name',
793 'view-transition-name',
794 'visibility',
795 'voice-balance',
796 'voice-duration',
797 'voice-family',
798 'voice-pitch',
799 'voice-range',
800 'voice-rate',
801 'voice-stress',
802 'voice-volume',
803 'white-space',
804 'white-space-collapse',
805 'widows',
806 'width',
807 'will-change',
808 'word-break',
809 'word-spacing',
810 'word-wrap',
811 'writing-mode',
812 'x',
813 'y',
814 'z-index',
815 'zoom'
816 ].sort().reverse();
817
818 /*
819 Language: CSS
820 Category: common, css, web
821 Website: https://developer.mozilla.org/en-US/docs/Web/CSS
822 */
823
824
825 /** @type LanguageFn */
826 function css(hljs) {
827 const regex = hljs.regex;
828 const modes = MODES(hljs);
829 const VENDOR_PREFIX = { begin: /-(webkit|moz|ms|o)-(?=[a-z])/ };
830 const AT_MODIFIERS = "and or not only";
831 const AT_PROPERTY_RE = /@-?\w[\w]*(-\w+)*/; // @-webkit-keyframes
832 const IDENT_RE = '[a-zA-Z-][a-zA-Z0-9_-]*';
833 const STRINGS = [
834 hljs.APOS_STRING_MODE,
835 hljs.QUOTE_STRING_MODE
836 ];
837
838 return {
839 name: 'CSS',
840 case_insensitive: true,
841 illegal: /[=|'\$]/,
842 keywords: { keyframePosition: "from to" },
843 classNameAliases: {
844 // for visual continuity with `tag {}` and because we
845 // don't have a great class for this?
846 keyframePosition: "selector-tag" },
847 contains: [
848 modes.BLOCK_COMMENT,
849 VENDOR_PREFIX,
850 // to recognize keyframe 40% etc which are outside the scope of our
851 // attribute value mode
852 modes.CSS_NUMBER_MODE,
853 {
854 className: 'selector-id',
855 begin: /#[A-Za-z0-9_-]+/,
856 relevance: 0
857 },
858 {
859 className: 'selector-class',
860 begin: '\\.' + IDENT_RE,
861 relevance: 0
862 },
863 modes.ATTRIBUTE_SELECTOR_MODE,
864 {
865 className: 'selector-pseudo',
866 variants: [
867 { begin: ':(' + PSEUDO_CLASSES.join('|') + ')' },
868 { begin: ':(:)?(' + PSEUDO_ELEMENTS.join('|') + ')' }
869 ]
870 },
871 // we may actually need this (12/2020)
872 // { // pseudo-selector params
873 // begin: /\(/,
874 // end: /\)/,
875 // contains: [ hljs.CSS_NUMBER_MODE ]
876 // },
877 modes.CSS_VARIABLE,
878 {
879 className: 'attribute',
880 begin: '\\b(' + ATTRIBUTES.join('|') + ')\\b'
881 },
882 // attribute values
883 {
884 begin: /:/,
885 end: /[;}{]/,
886 contains: [
887 modes.BLOCK_COMMENT,
888 modes.HEXCOLOR,
889 modes.IMPORTANT,
890 modes.CSS_NUMBER_MODE,
891 ...STRINGS,
892 // needed to highlight these as strings and to avoid issues with
893 // illegal characters that might be inside urls that would tigger the
894 // languages illegal stack
895 {
896 begin: /(url|data-uri)\(/,
897 end: /\)/,
898 relevance: 0, // from keywords
899 keywords: { built_in: "url data-uri" },
900 contains: [
901 ...STRINGS,
902 {
903 className: "string",
904 // any character other than `)` as in `url()` will be the start
905 // of a string, which ends with `)` (from the parent mode)
906 begin: /[^)]/,
907 endsWithParent: true,
908 excludeEnd: true
909 }
910 ]
911 },
912 modes.FUNCTION_DISPATCH
913 ]
914 },
915 {
916 begin: regex.lookahead(/@/),
917 end: '[{;]',
918 relevance: 0,
919 illegal: /:/, // break on Less variables @var: ...
920 contains: [
921 {
922 className: 'keyword',
923 begin: AT_PROPERTY_RE
924 },
925 {
926 begin: /\s/,
927 endsWithParent: true,
928 excludeEnd: true,
929 relevance: 0,
930 keywords: {
931 $pattern: /[a-z-]+/,
932 keyword: AT_MODIFIERS,
933 attribute: MEDIA_FEATURES.join(" ")
934 },
935 contains: [
936 {
937 begin: /[a-z-]+(?=:)/,
938 className: "attribute"
939 },
940 ...STRINGS,
941 modes.CSS_NUMBER_MODE
942 ]
943 }
944 ]
945 },
946 {
947 className: 'selector-tag',
948 begin: '\\b(' + TAGS.join('|') + ')\\b'
949 }
950 ]
951 };
952 }
953
954 return css;
955
956 })();
957
958 hljs.registerLanguage('css', hljsGrammar);
959 })();