From 80fe1f0e4745c7191b44ca0e6b79f04a94012fb5 Mon Sep 17 00:00:00 2001 From: Thanos Karagiannis Date: Sat, 12 Jun 2021 18:24:38 +0300 Subject: [PATCH 1/4] feat: handle css variables syntax --- src/languages/css.js | 1 + src/languages/less.js | 1 + src/languages/lib/css-shared.js | 4 ++++ src/languages/scss.js | 1 + src/languages/stylus.js | 3 +++ 5 files changed, 10 insertions(+) diff --git a/src/languages/css.js b/src/languages/css.js index 5927c9920b..cd74457086 100644 --- 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 index e441f80ff0..c98492ee16 100644 --- 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 index d59ddff617..9145033f8d 100644 --- 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 index 56c0da6145..244e8505c3 100644 --- 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 index 7152938c6a..d329dc41e1 100644 --- 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 From 4d611e41a461b9dffab899bc2fe54bd422511586 Mon Sep 17 00:00:00 2001 From: Thanos Karagiannis Date: Sat, 12 Jun 2021 18:25:03 +0300 Subject: [PATCH 2/4] test(css): update markup scenarios to include variables --- test/markup/css/variables.expect.txt | 9 +++++++++ test/markup/css/variables.txt | 9 +++++++++ 2 files changed, 18 insertions(+) create mode 100644 test/markup/css/variables.expect.txt create mode 100644 test/markup/css/variables.txt diff --git a/test/markup/css/variables.expect.txt b/test/markup/css/variables.expect.txt new file mode 100644 index 0000000000..f3f52a3eb6 --- /dev/null +++ b/test/markup/css/variables.expect.txt @@ -0,0 +1,9 @@ +body { + --text-color: red; + color: var(--text-color); +} + +body { + --textBlue: blue; + color: var(--textBlue); +} diff --git a/test/markup/css/variables.txt b/test/markup/css/variables.txt new file mode 100644 index 0000000000..745a14ec90 --- /dev/null +++ b/test/markup/css/variables.txt @@ -0,0 +1,9 @@ +body { + --text-color: red; + color: var(--text-color); +} + +body { + --textBlue: blue; + color: var(--textBlue); +} From d12479df1f5c58646d5563a4a086859100693491 Mon Sep 17 00:00:00 2001 From: Thanos Karagiannis Date: Sun, 13 Jun 2021 16:45:26 +0300 Subject: [PATCH 3/4] chore: update test scenarios for css_consistency --- test/markup/css/css_consistency.expect.txt | 5 +++++ test/markup/css/css_consistency.txt | 5 +++++ test/markup/less/css_consistency.expect.txt | 5 +++++ test/markup/less/css_consistency.txt | 5 +++++ test/markup/scss/css_consistency.expect.txt | 5 +++++ test/markup/scss/css_consistency.txt | 5 +++++ test/markup/stylus/css_consistency.expect.txt | 5 +++++ test/markup/stylus/css_consistency.txt | 5 +++++ 8 files changed, 40 insertions(+) diff --git a/test/markup/css/css_consistency.expect.txt b/test/markup/css/css_consistency.expect.txt index 0f36f5e4f3..31ee17b143 100644 --- a/test/markup/css/css_consistency.expect.txt +++ b/test/markup/css/css_consistency.expect.txt @@ -63,3 +63,8 @@ 50% { margin-top: 60px !important; } to { margin-top: 100px; } } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/css/css_consistency.txt b/test/markup/css/css_consistency.txt index e09f2cad3a..1dc3879b73 100644 --- a/test/markup/css/css_consistency.txt +++ b/test/markup/css/css_consistency.txt @@ -63,3 +63,8 @@ a[href*="example"] {} 50% { margin-top: 60px !important; } to { margin-top: 100px; } } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/less/css_consistency.expect.txt b/test/markup/less/css_consistency.expect.txt index 8007197491..e60d0c8dfb 100644 --- a/test/markup/less/css_consistency.expect.txt +++ b/test/markup/less/css_consistency.expect.txt @@ -57,3 +57,8 @@ /* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */ } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/less/css_consistency.txt b/test/markup/less/css_consistency.txt index 365b3c135c..26ed3b079e 100644 --- a/test/markup/less/css_consistency.txt +++ b/test/markup/less/css_consistency.txt @@ -57,3 +57,8 @@ a[href*="example"] {} /* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */ } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/scss/css_consistency.expect.txt b/test/markup/scss/css_consistency.expect.txt index 8007197491..e60d0c8dfb 100644 --- a/test/markup/scss/css_consistency.expect.txt +++ b/test/markup/scss/css_consistency.expect.txt @@ -57,3 +57,8 @@ /* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */ } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/scss/css_consistency.txt b/test/markup/scss/css_consistency.txt index 365b3c135c..26ed3b079e 100644 --- a/test/markup/scss/css_consistency.txt +++ b/test/markup/scss/css_consistency.txt @@ -57,3 +57,8 @@ a[href*="example"] {} /* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */ } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/stylus/css_consistency.expect.txt b/test/markup/stylus/css_consistency.expect.txt index 8007197491..e60d0c8dfb 100644 --- a/test/markup/stylus/css_consistency.expect.txt +++ b/test/markup/stylus/css_consistency.expect.txt @@ -57,3 +57,8 @@ /* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */ } + +main { + --color: red; + color: var(--color); +} diff --git a/test/markup/stylus/css_consistency.txt b/test/markup/stylus/css_consistency.txt index 365b3c135c..26ed3b079e 100644 --- a/test/markup/stylus/css_consistency.txt +++ b/test/markup/stylus/css_consistency.txt @@ -57,3 +57,8 @@ a[href*="example"] {} /* src: url("/fonts/OpenSans-Regular-webfont.woff2") format("woff2"), url("/fonts/OpenSans-Regular-webfont.woff") format("woff"); */ } + +main { + --color: red; + color: var(--color); +} From 4f759a57de584377ea01f73a6d3687208cca5efe Mon Sep 17 00:00:00 2001 From: Thanos Karagiannis Date: Sun, 13 Jun 2021 16:51:08 +0300 Subject: [PATCH 4/4] chore: update CHANGES.md --- CHANGES.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGES.md b/CHANGES.md index a5eb85b1b1..ce69cd52a0 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -4,6 +4,7 @@ Grammars: - fix(csharp) add missing `catch` keyword (#3251) [Konrad Rudolph][] - add additional keywords to csp.js (#3244) [Elijah Conners][] +- feat(css) handle css variables syntax (#3239) [Thanos Karagiannis][] - fix(markdown) Images with empty alt or links with empty text (#3233) [Josh Goebel][] - enh(powershell) added `pwsh` alias (#3236) [tebeco][] - fix(r) fix bug highlighting examples in doc comments [Konrad Rudolph][] @@ -24,6 +25,7 @@ Grammars: [tebeco]: https://github.com/tebeco [Pankaj Patil]: https://github.com/patil2099 [Benedikt Wilde]: https://github.com/schtandard +[Thanos Karagiannis]: https://github.com/thanoskrg ## Version 11.0.0