/ src / theme / languages / scss.js
scss.js
  1  /*! `scss` grammar compiled for Highlight.js 11.10.0 */
  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      'animation',
309      'animation-delay',
310      'animation-direction',
311      'animation-duration',
312      'animation-fill-mode',
313      'animation-iteration-count',
314      'animation-name',
315      'animation-play-state',
316      'animation-timing-function',
317      'appearance',
318      'backface-visibility',
319      'background',
320      'background-attachment',
321      'background-blend-mode',
322      'background-clip',
323      'background-color',
324      'background-image',
325      'background-origin',
326      'background-position',
327      'background-repeat',
328      'background-size',
329      'baseline-shift',
330      'block-size',
331      'border',
332      'border-block',
333      'border-block-color',
334      'border-block-end',
335      'border-block-end-color',
336      'border-block-end-style',
337      'border-block-end-width',
338      'border-block-start',
339      'border-block-start-color',
340      'border-block-start-style',
341      'border-block-start-width',
342      'border-block-style',
343      'border-block-width',
344      'border-bottom',
345      'border-bottom-color',
346      'border-bottom-left-radius',
347      'border-bottom-right-radius',
348      'border-bottom-style',
349      'border-bottom-width',
350      'border-collapse',
351      'border-color',
352      'border-image',
353      'border-image-outset',
354      'border-image-repeat',
355      'border-image-slice',
356      'border-image-source',
357      'border-image-width',
358      'border-inline',
359      'border-inline-color',
360      'border-inline-end',
361      'border-inline-end-color',
362      'border-inline-end-style',
363      'border-inline-end-width',
364      'border-inline-start',
365      'border-inline-start-color',
366      'border-inline-start-style',
367      'border-inline-start-width',
368      'border-inline-style',
369      'border-inline-width',
370      'border-left',
371      'border-left-color',
372      'border-left-style',
373      'border-left-width',
374      'border-radius',
375      'border-right',
376      'border-end-end-radius',
377      'border-end-start-radius',
378      'border-right-color',
379      'border-right-style',
380      'border-right-width',
381      'border-spacing',
382      'border-start-end-radius',
383      'border-start-start-radius',
384      'border-style',
385      'border-top',
386      'border-top-color',
387      'border-top-left-radius',
388      'border-top-right-radius',
389      'border-top-style',
390      'border-top-width',
391      'border-width',
392      'bottom',
393      'box-decoration-break',
394      'box-shadow',
395      'box-sizing',
396      'break-after',
397      'break-before',
398      'break-inside',
399      'cx',
400      'cy',
401      'caption-side',
402      'caret-color',
403      'clear',
404      'clip',
405      'clip-path',
406      'clip-rule',
407      'color',
408      'color-interpolation',
409      'color-interpolation-filters',
410      'color-profile',
411      'color-rendering',
412      'color-scheme',
413      'column-count',
414      'column-fill',
415      'column-gap',
416      'column-rule',
417      'column-rule-color',
418      'column-rule-style',
419      'column-rule-width',
420      'column-span',
421      'column-width',
422      'columns',
423      'contain',
424      'content',
425      'content-visibility',
426      'counter-increment',
427      'counter-reset',
428      'cue',
429      'cue-after',
430      'cue-before',
431      'cursor',
432      'direction',
433      'display',
434      'dominant-baseline',
435      'empty-cells',
436      'enable-background',
437      'fill',
438      'fill-opacity',
439      'fill-rule',
440      'filter',
441      'flex',
442      'flex-basis',
443      'flex-direction',
444      'flex-flow',
445      'flex-grow',
446      'flex-shrink',
447      'flex-wrap',
448      'float',
449      'flow',
450      'flood-color',
451      'flood-opacity',
452      'font',
453      'font-display',
454      'font-family',
455      'font-feature-settings',
456      'font-kerning',
457      'font-language-override',
458      'font-size',
459      'font-size-adjust',
460      'font-smoothing',
461      'font-stretch',
462      'font-style',
463      'font-synthesis',
464      'font-variant',
465      'font-variant-caps',
466      'font-variant-east-asian',
467      'font-variant-ligatures',
468      'font-variant-numeric',
469      'font-variant-position',
470      'font-variation-settings',
471      'font-weight',
472      'gap',
473      'glyph-orientation-horizontal',
474      'glyph-orientation-vertical',
475      'grid',
476      'grid-area',
477      'grid-auto-columns',
478      'grid-auto-flow',
479      'grid-auto-rows',
480      'grid-column',
481      'grid-column-end',
482      'grid-column-start',
483      'grid-gap',
484      'grid-row',
485      'grid-row-end',
486      'grid-row-start',
487      'grid-template',
488      'grid-template-areas',
489      'grid-template-columns',
490      'grid-template-rows',
491      'hanging-punctuation',
492      'height',
493      'hyphens',
494      'icon',
495      'image-orientation',
496      'image-rendering',
497      'image-resolution',
498      'ime-mode',
499      'inline-size',
500      'inset',
501      'inset-block',
502      'inset-block-end',
503      'inset-block-start',
504      'inset-inline',
505      'inset-inline-end',
506      'inset-inline-start',
507      'isolation',
508      'kerning',
509      'justify-content',
510      'justify-items',
511      'justify-self',
512      'left',
513      'letter-spacing',
514      'lighting-color',
515      'line-break',
516      'line-height',
517      'list-style',
518      'list-style-image',
519      'list-style-position',
520      'list-style-type',
521      'marker',
522      'marker-end',
523      'marker-mid',
524      'marker-start',
525      'mask',
526      'margin',
527      'margin-block',
528      'margin-block-end',
529      'margin-block-start',
530      'margin-bottom',
531      'margin-inline',
532      'margin-inline-end',
533      'margin-inline-start',
534      'margin-left',
535      'margin-right',
536      'margin-top',
537      'marks',
538      'mask',
539      'mask-border',
540      'mask-border-mode',
541      'mask-border-outset',
542      'mask-border-repeat',
543      'mask-border-slice',
544      'mask-border-source',
545      'mask-border-width',
546      'mask-clip',
547      'mask-composite',
548      'mask-image',
549      'mask-mode',
550      'mask-origin',
551      'mask-position',
552      'mask-repeat',
553      'mask-size',
554      'mask-type',
555      'max-block-size',
556      'max-height',
557      'max-inline-size',
558      'max-width',
559      'min-block-size',
560      'min-height',
561      'min-inline-size',
562      'min-width',
563      'mix-blend-mode',
564      'nav-down',
565      'nav-index',
566      'nav-left',
567      'nav-right',
568      'nav-up',
569      'none',
570      'normal',
571      'object-fit',
572      'object-position',
573      'opacity',
574      'order',
575      'orphans',
576      'outline',
577      'outline-color',
578      'outline-offset',
579      'outline-style',
580      'outline-width',
581      'overflow',
582      'overflow-wrap',
583      'overflow-x',
584      'overflow-y',
585      'padding',
586      'padding-block',
587      'padding-block-end',
588      'padding-block-start',
589      'padding-bottom',
590      'padding-inline',
591      'padding-inline-end',
592      'padding-inline-start',
593      'padding-left',
594      'padding-right',
595      'padding-top',
596      'page-break-after',
597      'page-break-before',
598      'page-break-inside',
599      'pause',
600      'pause-after',
601      'pause-before',
602      'perspective',
603      'perspective-origin',
604      'pointer-events',
605      'position',
606      'quotes',
607      'r',
608      'resize',
609      'rest',
610      'rest-after',
611      'rest-before',
612      'right',
613      'rotate',
614      'row-gap',
615      'scale',
616      'scroll-margin',
617      'scroll-margin-block',
618      'scroll-margin-block-end',
619      'scroll-margin-block-start',
620      'scroll-margin-bottom',
621      'scroll-margin-inline',
622      'scroll-margin-inline-end',
623      'scroll-margin-inline-start',
624      'scroll-margin-left',
625      'scroll-margin-right',
626      'scroll-margin-top',
627      'scroll-padding',
628      'scroll-padding-block',
629      'scroll-padding-block-end',
630      'scroll-padding-block-start',
631      'scroll-padding-bottom',
632      'scroll-padding-inline',
633      'scroll-padding-inline-end',
634      'scroll-padding-inline-start',
635      'scroll-padding-left',
636      'scroll-padding-right',
637      'scroll-padding-top',
638      'scroll-snap-align',
639      'scroll-snap-stop',
640      'scroll-snap-type',
641      'scrollbar-color',
642      'scrollbar-gutter',
643      'scrollbar-width',
644      'shape-image-threshold',
645      'shape-margin',
646      'shape-outside',
647      'shape-rendering',
648      'stop-color',
649      'stop-opacity',
650      'stroke',
651      'stroke-dasharray',
652      'stroke-dashoffset',
653      'stroke-linecap',
654      'stroke-linejoin',
655      'stroke-miterlimit',
656      'stroke-opacity',
657      'stroke-width',
658      'speak',
659      'speak-as',
660      'src', // @font-face
661      'tab-size',
662      'table-layout',
663      'text-anchor',
664      'text-align',
665      'text-align-all',
666      'text-align-last',
667      'text-combine-upright',
668      'text-decoration',
669      'text-decoration-color',
670      'text-decoration-line',
671      'text-decoration-skip-ink',
672      'text-decoration-style',
673      'text-decoration-thickness',
674      'text-emphasis',
675      'text-emphasis-color',
676      'text-emphasis-position',
677      'text-emphasis-style',
678      'text-indent',
679      'text-justify',
680      'text-orientation',
681      'text-overflow',
682      'text-rendering',
683      'text-shadow',
684      'text-transform',
685      'text-underline-offset',
686      'text-underline-position',
687      'top',
688      'transform',
689      'transform-box',
690      'transform-origin',
691      'transform-style',
692      'transition',
693      'transition-delay',
694      'transition-duration',
695      'transition-property',
696      'transition-timing-function',
697      'translate',
698      'unicode-bidi',
699      'vector-effect',
700      'vertical-align',
701      'visibility',
702      'voice-balance',
703      'voice-duration',
704      'voice-family',
705      'voice-pitch',
706      'voice-range',
707      'voice-rate',
708      'voice-stress',
709      'voice-volume',
710      'white-space',
711      'widows',
712      'width',
713      'will-change',
714      'word-break',
715      'word-spacing',
716      'word-wrap',
717      'writing-mode',
718      'x',
719      'y',
720      'z-index'
721    ].sort().reverse();
722  
723    /*
724    Language: SCSS
725    Description: Scss is an extension of the syntax of CSS.
726    Author: Kurt Emch <kurt@kurtemch.com>
727    Website: https://sass-lang.com
728    Category: common, css, web
729    */
730  
731  
732    /** @type LanguageFn */
733    function scss(hljs) {
734      const modes = MODES(hljs);
735      const PSEUDO_ELEMENTS$1 = PSEUDO_ELEMENTS;
736      const PSEUDO_CLASSES$1 = PSEUDO_CLASSES;
737  
738      const AT_IDENTIFIER = '@[a-z-]+'; // @font-face
739      const AT_MODIFIERS = "and or not only";
740      const IDENT_RE = '[a-zA-Z-][a-zA-Z0-9_-]*';
741      const VARIABLE = {
742        className: 'variable',
743        begin: '(\\$' + IDENT_RE + ')\\b',
744        relevance: 0
745      };
746  
747      return {
748        name: 'SCSS',
749        case_insensitive: true,
750        illegal: '[=/|\']',
751        contains: [
752          hljs.C_LINE_COMMENT_MODE,
753          hljs.C_BLOCK_COMMENT_MODE,
754          // to recognize keyframe 40% etc which are outside the scope of our
755          // attribute value mode
756          modes.CSS_NUMBER_MODE,
757          {
758            className: 'selector-id',
759            begin: '#[A-Za-z0-9_-]+',
760            relevance: 0
761          },
762          {
763            className: 'selector-class',
764            begin: '\\.[A-Za-z0-9_-]+',
765            relevance: 0
766          },
767          modes.ATTRIBUTE_SELECTOR_MODE,
768          {
769            className: 'selector-tag',
770            begin: '\\b(' + TAGS.join('|') + ')\\b',
771            // was there, before, but why?
772            relevance: 0
773          },
774          {
775            className: 'selector-pseudo',
776            begin: ':(' + PSEUDO_CLASSES$1.join('|') + ')'
777          },
778          {
779            className: 'selector-pseudo',
780            begin: ':(:)?(' + PSEUDO_ELEMENTS$1.join('|') + ')'
781          },
782          VARIABLE,
783          { // pseudo-selector params
784            begin: /\(/,
785            end: /\)/,
786            contains: [ modes.CSS_NUMBER_MODE ]
787          },
788          modes.CSS_VARIABLE,
789          {
790            className: 'attribute',
791            begin: '\\b(' + ATTRIBUTES.join('|') + ')\\b'
792          },
793          { begin: '\\b(whitespace|wait|w-resize|visible|vertical-text|vertical-ideographic|uppercase|upper-roman|upper-alpha|underline|transparent|top|thin|thick|text|text-top|text-bottom|tb-rl|table-header-group|table-footer-group|sw-resize|super|strict|static|square|solid|small-caps|separate|se-resize|scroll|s-resize|rtl|row-resize|ridge|right|repeat|repeat-y|repeat-x|relative|progress|pointer|overline|outside|outset|oblique|nowrap|not-allowed|normal|none|nw-resize|no-repeat|no-drop|newspaper|ne-resize|n-resize|move|middle|medium|ltr|lr-tb|lowercase|lower-roman|lower-alpha|loose|list-item|line|line-through|line-edge|lighter|left|keep-all|justify|italic|inter-word|inter-ideograph|inside|inset|inline|inline-block|inherit|inactive|ideograph-space|ideograph-parenthesis|ideograph-numeric|ideograph-alpha|horizontal|hidden|help|hand|groove|fixed|ellipsis|e-resize|double|dotted|distribute|distribute-space|distribute-letter|distribute-all-lines|disc|disabled|default|decimal|dashed|crosshair|collapse|col-resize|circle|char|center|capitalize|break-word|break-all|bottom|both|bolder|bold|block|bidi-override|below|baseline|auto|always|all-scroll|absolute|table|table-cell)\\b' },
794          {
795            begin: /:/,
796            end: /[;}{]/,
797            relevance: 0,
798            contains: [
799              modes.BLOCK_COMMENT,
800              VARIABLE,
801              modes.HEXCOLOR,
802              modes.CSS_NUMBER_MODE,
803              hljs.QUOTE_STRING_MODE,
804              hljs.APOS_STRING_MODE,
805              modes.IMPORTANT,
806              modes.FUNCTION_DISPATCH
807            ]
808          },
809          // matching these here allows us to treat them more like regular CSS
810          // rules so everything between the {} gets regular rule highlighting,
811          // which is what we want for page and font-face
812          {
813            begin: '@(page|font-face)',
814            keywords: {
815              $pattern: AT_IDENTIFIER,
816              keyword: '@page @font-face'
817            }
818          },
819          {
820            begin: '@',
821            end: '[{;]',
822            returnBegin: true,
823            keywords: {
824              $pattern: /[a-z-]+/,
825              keyword: AT_MODIFIERS,
826              attribute: MEDIA_FEATURES.join(" ")
827            },
828            contains: [
829              {
830                begin: AT_IDENTIFIER,
831                className: "keyword"
832              },
833              {
834                begin: /[a-z-]+(?=:)/,
835                className: "attribute"
836              },
837              VARIABLE,
838              hljs.QUOTE_STRING_MODE,
839              hljs.APOS_STRING_MODE,
840              modes.HEXCOLOR,
841              modes.CSS_NUMBER_MODE
842            ]
843          },
844          modes.FUNCTION_DISPATCH
845        ]
846      };
847    }
848  
849    return scss;
850  
851  })();
852  
853      hljs.registerLanguage('scss', hljsGrammar);
854    })();