From f40157462350e12d475bc250ee9490b37e164f7b Mon Sep 17 00:00:00 2001 From: Nikita Ourazbaev <41582891+nikitaourazbaev@users.noreply.github.com> Date: Wed, 28 May 2025 14:38:01 -0400 Subject: [PATCH 1/2] Add support for the `{% stylesheet %}` Liquid tag --- Syntaxes/Liquid.sublime-syntax | 7 ++++--- tests/syntax_test_liquid.liquid.html | 28 ++++++++++++++++++++++++++++ 2 files changed, 32 insertions(+), 3 deletions(-) diff --git a/Syntaxes/Liquid.sublime-syntax b/Syntaxes/Liquid.sublime-syntax index d52555f..bea0f16 100644 --- a/Syntaxes/Liquid.sublime-syntax +++ b/Syntaxes/Liquid.sublime-syntax @@ -127,11 +127,12 @@ contexts: 2: keyword.declaration.schema.liquid 3: punctuation.section.embedded.end.liquid -###[ LIQUID STYLE TAGS ]####################################################### +###[ LIQUID STYLE AND STYLESHEET TAGS ]####################################### liquid-style-tags: # https://shopify.dev/api/liquid/tags/theme-tags#style - - match: ({%-?)\s*(style)\s*(-?%}) + # https://shopify.dev/docs/api/liquid/tags/theme-tags#stylesheet + - match: ({%-?)\s*(style|stylesheet)\s*(-?%}) scope: meta.embedded.liquid source.liquid meta.statement.liquid captures: 1: punctuation.section.embedded.begin.liquid @@ -139,7 +140,7 @@ contexts: 3: punctuation.section.embedded.end.liquid embed: scope:source.css.liquid embed_scope: source.css.embedded.liquid - escape: ({%-?)\s*(endstyle)\s*(-?%}) + escape: ({%-?)\s*(end\2)\s*(-?%}) escape_captures: 0: meta.embedded.liquid source.liquid meta.statement.liquid 1: punctuation.section.embedded.begin.liquid diff --git a/tests/syntax_test_liquid.liquid.html b/tests/syntax_test_liquid.liquid.html index e931f97..0c87ab0 100644 --- a/tests/syntax_test_liquid.liquid.html +++ b/tests/syntax_test_liquid.liquid.html @@ -594,6 +594,34 @@ | ^^^^^^^^ keyword.declaration.raw.liquid | ^^ punctuation.section.embedded.end.liquid +{% stylesheet %} +| <- meta.embedded.liquid source.liquid meta.statement.liquid punctuation.section.embedded.begin.liquid +|^^^^^^^^^^^^^^^ meta.embedded.liquid source.liquid meta.statement.liquid +|^ punctuation.section.embedded.begin.liquid +| ^^^^^^^^^^ keyword.declaration.raw.liquid +| ^^ punctuation.section.embedded.end.liquid + +div { + font-{{family}}: "{{font}}"; +| ^^^^^^^^^^ meta.property-list.css meta.block.css meta.interpolation.liquid +| ^^ punctuation.section.interpolation.begin.liquid +| ^^^^^^ variable.other.liquid +| ^^ punctuation.section.interpolation.end.liquid +| ^ meta.string.css string.quoted.double.css punctuation.definition.string.begin.css +| ^^^^^^^^ meta.property-list.css meta.block.css meta.property-value.css meta.string.css meta.interpolation.liquid +| ^^ punctuation.section.interpolation.begin.liquid +| ^^^^ variable.other.liquid +| ^^ punctuation.section.interpolation.end.liquid +| ^ meta.string.css string.quoted.double.css punctuation.definition.string.end.css +} + +{% endstylesheet %} +| <- meta.embedded.liquid source.liquid meta.statement.liquid punctuation.section.embedded.begin.liquid +|^^^^^^^^^^^^^^^^^ meta.embedded.liquid source.liquid meta.statement.liquid +|^ punctuation.section.embedded.begin.liquid +| ^^^^^^^^^^^^^ keyword.declaration.raw.liquid +| ^^ punctuation.section.embedded.end.liquid + {% plugin "foo" %} | <- meta.embedded.liquid source.liquid meta.statement.liquid punctuation.section.embedded.begin.liquid |^^^^^^^^^^^^^^^^^ meta.embedded.liquid source.liquid meta.statement.liquid From 42a5e67b33d0f74e9ca544d29235e210d01f9fd0 Mon Sep 17 00:00:00 2001 From: Nikita Ourazbaev <41582891+nikitaourazbaev@users.noreply.github.com> Date: Wed, 28 May 2025 16:43:58 -0400 Subject: [PATCH 2/2] Update stylesheet tags to match spec --- Syntaxes/Liquid.sublime-syntax | 27 +++++++++++++++++++++++---- tests/syntax_test_liquid.liquid.html | 12 +----------- 2 files changed, 24 insertions(+), 15 deletions(-) diff --git a/Syntaxes/Liquid.sublime-syntax b/Syntaxes/Liquid.sublime-syntax index bea0f16..e342e8b 100644 --- a/Syntaxes/Liquid.sublime-syntax +++ b/Syntaxes/Liquid.sublime-syntax @@ -30,6 +30,7 @@ contexts: - include: liquid-schema-tags - include: liquid-javascript-tags - include: liquid-style-tags + - include: liquid-stylesheet-tags - include: liquid-raw-tags - include: liquid-statement-tags @@ -127,12 +128,11 @@ contexts: 2: keyword.declaration.schema.liquid 3: punctuation.section.embedded.end.liquid -###[ LIQUID STYLE AND STYLESHEET TAGS ]####################################### +###[ LIQUID STYLE TAGS ]###################################################### liquid-style-tags: # https://shopify.dev/api/liquid/tags/theme-tags#style - # https://shopify.dev/docs/api/liquid/tags/theme-tags#stylesheet - - match: ({%-?)\s*(style|stylesheet)\s*(-?%}) + - match: ({%-?)\s*(style)\s*(-?%}) scope: meta.embedded.liquid source.liquid meta.statement.liquid captures: 1: punctuation.section.embedded.begin.liquid @@ -140,7 +140,26 @@ contexts: 3: punctuation.section.embedded.end.liquid embed: scope:source.css.liquid embed_scope: source.css.embedded.liquid - escape: ({%-?)\s*(end\2)\s*(-?%}) + escape: ({%-?)\s*(endstyle)\s*(-?%}) + escape_captures: + 0: meta.embedded.liquid source.liquid meta.statement.liquid + 1: punctuation.section.embedded.begin.liquid + 2: keyword.declaration.raw.liquid + 3: punctuation.section.embedded.end.liquid + +###[ LIQUID STYLESHEET TAGS ]################################################# + + liquid-stylesheet-tags: + # https://shopify.dev/docs/api/liquid/tags/theme-tags#stylesheet + - match: ({%-?)\s*(stylesheet)\s*(-?%}) + scope: meta.embedded.liquid source.liquid meta.statement.liquid + captures: + 1: punctuation.section.embedded.begin.liquid + 2: keyword.declaration.raw.liquid + 3: punctuation.section.embedded.end.liquid + embed: scope:source.css + embed_scope: source.css.embedded.liquid + escape: ({%-?)\s*(endstylesheet)\s*(-?%}) escape_captures: 0: meta.embedded.liquid source.liquid meta.statement.liquid 1: punctuation.section.embedded.begin.liquid diff --git a/tests/syntax_test_liquid.liquid.html b/tests/syntax_test_liquid.liquid.html index 0c87ab0..fed65dc 100644 --- a/tests/syntax_test_liquid.liquid.html +++ b/tests/syntax_test_liquid.liquid.html @@ -602,17 +602,7 @@ | ^^ punctuation.section.embedded.end.liquid div { - font-{{family}}: "{{font}}"; -| ^^^^^^^^^^ meta.property-list.css meta.block.css meta.interpolation.liquid -| ^^ punctuation.section.interpolation.begin.liquid -| ^^^^^^ variable.other.liquid -| ^^ punctuation.section.interpolation.end.liquid -| ^ meta.string.css string.quoted.double.css punctuation.definition.string.begin.css -| ^^^^^^^^ meta.property-list.css meta.block.css meta.property-value.css meta.string.css meta.interpolation.liquid -| ^^ punctuation.section.interpolation.begin.liquid -| ^^^^ variable.other.liquid -| ^^ punctuation.section.interpolation.end.liquid -| ^ meta.string.css string.quoted.double.css punctuation.definition.string.end.css + display: none; } {% endstylesheet %}