static/highlight/es/languages/css.js

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