feat: handle css variables syntax

highlightjs · Jun 13, 2021 · 3bcfd56 · 3bcfd56
1 parent 40b6a8a
commit 3bcfd56
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 0 deletions.
diff --git a/src/languages/css.js b/src/languages/css.js
@@ -72,6 +72,7 @@ export default function(hljs) {
       //   end: /\)/,
       //   contains: [ hljs.CSS_NUMBER_MODE ]
       // },
+      modes.CSS_VARIABLE,
       {
         className: 'attribute',
         begin: '\\b(' + css.ATTRIBUTES.join('|') + ')\\b'

diff --git a/src/languages/less.js b/src/languages/less.js
@@ -109,6 +109,7 @@ export default function(hljs) {
       {
         begin: /-(webkit|moz|ms|o)-/
       },
+      modes.CSS_VARIABLE,
       {
         className: 'attribute',
         begin: '\\b(' + css.ATTRIBUTES.join('|') + ')\\b',

diff --git a/src/languages/lib/css-shared.js b/src/languages/lib/css-shared.js
@@ -30,6 +30,10 @@ export const MODES = (hljs) => {
         '|dpi|dpcm|dppx' +
         ')?',
       relevance: 0
+    },
+    CSS_VARIABLE: {
+      className: "attr",
+      begin: /--[A-Za-z][A-Za-z0-9_-]*/
     }
   };
 };

diff --git a/src/languages/scss.js b/src/languages/scss.js
@@ -60,6 +60,7 @@ export default function(hljs) {
         end: /\)/,
         contains: [ modes.CSS_NUMBER_MODE ]
       },
+      modes.CSS_VARIABLE,
       {
         className: 'attribute',
         begin: '\\b(' + css.ATTRIBUTES.join('|') + ')\\b'

diff --git a/src/languages/stylus.js b/src/languages/stylus.js
@@ -154,6 +154,9 @@ export default function(hljs) {
         ]
       },
 
+      // css variables
+      modes.CSS_VARIABLE,
+
       // attributes
       //  - only from beginning of line + whitespace
       //  - must have whitespace after it