Skip to content

Commit 55d3107

Browse files
committed
Fix highlighting of @theme params
1 parent 4ee93f2 commit 55d3107

File tree

2 files changed

+90
-34
lines changed

2 files changed

+90
-34
lines changed

packages/tailwindcss-language-syntax/tests/__snapshots__/syntax.test.ts.snap

Lines changed: 41 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -698,65 +698,72 @@ exports[`@theme 1`] = `
698698
^^^^^^^^ 4: source.css.tailwind
699699
^^^^^^ 2: keyword.control.at-rule.theme.tailwind
700700
^ 1: punctuation.definition.keyword.css
701-
^ 1: meta.property-list.css punctuation.section.property-list.begin.bracket.curly.css
701+
^ 1: variable.other.css
702+
^ 1: meta.at-rule.theme.body.tailwind punctuation.section.theme.begin.bracket.curly.tailwind
702703
703704
--color: red;
704-
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.property-list.css
705-
^^^^^^^ 1: variable.css
705+
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.at-rule.theme.body.tailwind
706+
^^^^^^^ 1: meta.property-name.css
706707
^ 1: punctuation.separator.key-value.css
707708
^^^ 1: meta.property-value.css support.constant.color.w3c-standard-color-name.css
708709
^ 1: punctuation.terminator.rule.css
709710
710711
}
711-
^ 1: source.css.tailwind meta.property-list.css punctuation.section.property-list.end.bracket.curly.css
712+
^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind punctuation.section.theme.end.bracket.curly.tailwind
712713
713714
@theme static {
714-
^^^^^^^^^^^^^^^ 4: source.css.tailwind
715+
^^^^^^^^^^^^^^^ 6: source.css.tailwind
715716
^^^^^^ 2: keyword.control.at-rule.theme.tailwind
716717
^ 1: punctuation.definition.keyword.css
717-
^ 1: meta.property-list.css punctuation.section.property-list.begin.bracket.curly.css
718+
^^^^^^^^ 3: variable.other.css
719+
^ 1: meta.at-rule.theme.body.tailwind punctuation.section.theme.begin.bracket.curly.tailwind
718720
719721
--color: red;
720-
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.property-list.css
721-
^^^^^^^ 1: variable.css
722+
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.at-rule.theme.body.tailwind
723+
^^^^^^^ 1: meta.property-name.css
722724
^ 1: punctuation.separator.key-value.css
723725
^^^ 1: meta.property-value.css support.constant.color.w3c-standard-color-name.css
724726
^ 1: punctuation.terminator.rule.css
725727
726728
}
727-
^ 1: source.css.tailwind meta.property-list.css punctuation.section.property-list.end.bracket.curly.css
729+
^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind punctuation.section.theme.end.bracket.curly.tailwind
728730
729731
@theme inline deprecated {
730-
^^^^^^^^^^^^^^^^^^^^^^^^^^ 4: source.css.tailwind
732+
^^^^^^^^^^^^^^^^^^^^^^^^^^ 8: source.css.tailwind
731733
^^^^^^ 2: keyword.control.at-rule.theme.tailwind
732734
^ 1: punctuation.definition.keyword.css
733-
^ 1: meta.property-list.css punctuation.section.property-list.begin.bracket.curly.css
735+
^^^^^^^^^^^^^^^^^^^ 5: variable.other.css
736+
^ 1: meta.at-rule.theme.body.tailwind punctuation.section.theme.begin.bracket.curly.tailwind
734737
735738
--color: red;
736-
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.property-list.css
737-
^^^^^^^ 1: variable.css
739+
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.at-rule.theme.body.tailwind
740+
^^^^^^^ 1: meta.property-name.css
738741
^ 1: punctuation.separator.key-value.css
739742
^^^ 1: meta.property-value.css support.constant.color.w3c-standard-color-name.css
740743
^ 1: punctuation.terminator.rule.css
741744
742745
}
743-
^ 1: source.css.tailwind meta.property-list.css punctuation.section.property-list.end.bracket.curly.css
746+
^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind punctuation.section.theme.end.bracket.curly.tailwind
744747
745748
@theme prefix(tw) inline {
746-
^^^^^^^^^^^^^^^^^^^^^^^^^^ 4: source.css.tailwind
749+
^^^^^^^^^^^^^^^^^^^^^^^^^^ 11: source.css.tailwind
747750
^^^^^^ 2: keyword.control.at-rule.theme.tailwind
748751
^ 1: punctuation.definition.keyword.css
749-
^ 1: meta.property-list.css punctuation.section.property-list.begin.bracket.curly.css
752+
^^^^^^ 1: support.function.prefix.css
753+
^ 1: punctuation.section.function.begin.bracket.round.css
754+
^^ ^^^^^^^^ 4: variable.other.css
755+
^ 1: punctuation.section.function.end.bracket.round.css
756+
^ 1: meta.at-rule.theme.body.tailwind punctuation.section.theme.begin.bracket.curly.tailwind
750757
751758
--color: red;
752-
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.property-list.css
753-
^^^^^^^ 1: variable.css
759+
^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.at-rule.theme.body.tailwind
760+
^^^^^^^ 1: meta.property-name.css
754761
^ 1: punctuation.separator.key-value.css
755762
^^^ 1: meta.property-value.css support.constant.color.w3c-standard-color-name.css
756763
^ 1: punctuation.terminator.rule.css
757764
758765
}
759-
^ 1: source.css.tailwind meta.property-list.css punctuation.section.property-list.end.bracket.curly.css
766+
^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind punctuation.section.theme.end.bracket.curly.tailwind
760767
761768
762769
^ 1: source.css.tailwind
@@ -765,25 +772,26 @@ exports[`@theme 1`] = `
765772
^^^^^^^^ 4: source.css.tailwind
766773
^^^^^^ 2: keyword.control.at-rule.theme.tailwind
767774
^ 1: punctuation.definition.keyword.css
768-
^ 1: meta.property-list.css punctuation.section.property-list.begin.bracket.curly.css
775+
^ 1: variable.other.css
776+
^ 1: meta.at-rule.theme.body.tailwind punctuation.section.theme.begin.bracket.curly.tailwind
769777
770778
--spacing: initial;
771-
^^^^^^^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.property-list.css
772-
^^^^^^^^^ 1: variable.css
779+
^^^^^^^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.at-rule.theme.body.tailwind
780+
^^^^^^^^^ 1: meta.property-name.css
773781
^ 1: punctuation.separator.key-value.css
774782
^^^^^^^ 1: meta.property-value.css support.constant.property-value.css
775783
^ 1: punctuation.terminator.rule.css
776784
777785
--color-*: initial;
778-
^^^^^^^^^^^^^^^^^^^^^ 7: source.css.tailwind meta.property-list.css
779-
^^^^^^^^ 1: variable.css
786+
^^^^^^^^^^^^^^^^^^^^^ 7: source.css.tailwind meta.at-rule.theme.body.tailwind
787+
^^^^^^^^ 1: meta.property-name.css
780788
^ 1: punctuation.separator.key-value.css
781789
^^^^^^^ 1: meta.property-value.css support.constant.property-value.css
782790
^ 1: punctuation.terminator.rule.css
783791
784792
--animate-pulse: 1s pulse infinite;
785-
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 9: source.css.tailwind meta.property-list.css
786-
^^^^^^^^^^^^^^^ 1: variable.css
793+
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 9: source.css.tailwind meta.at-rule.theme.body.tailwind
794+
^^^^^^^^^^^^^^^ 1: meta.property-name.css
787795
^ 1: punctuation.separator.key-value.css
788796
^^^^^^^^^^^^^^^^^ 4: meta.property-value.css
789797
^^ 2: constant.numeric.css
@@ -792,28 +800,28 @@ exports[`@theme 1`] = `
792800
^ 1: punctuation.terminator.rule.css
793801
794802
795-
^ 1: source.css.tailwind meta.property-list.css
803+
^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind
796804
797805
@keyframes pulse {
798-
^^^^^^^^^^^^^^^^^^^^^ 5: source.css.tailwind meta.property-list.css
806+
^^^^^^^^^^^^^^^^^^^^^ 5: source.css.tailwind meta.at-rule.theme.body.tailwind
799807
^^^^^^^^^ ^^^^^ 2: meta.property-name.css
800808
801809
0%,
802-
^^^^^^^^ 1: source.css.tailwind meta.property-list.css
810+
^^^^^^^^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind
803811
804812
100% {
805-
^^^^^^^^^^^ 1: source.css.tailwind meta.property-list.css
813+
^^^^^^^^^^^ 1: source.css.tailwind meta.at-rule.theme.body.tailwind
806814
807815
opacity: 0;
808-
^^^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.property-list.css
816+
^^^^^^^^^^^^^^^^^ 6: source.css.tailwind meta.at-rule.theme.body.tailwind
809817
^^^^^^^ 1: meta.property-name.css support.type.property-name.css
810818
^ 1: punctuation.separator.key-value.css
811819
^ 1: meta.property-value.css constant.numeric.css
812820
^ 1: punctuation.terminator.rule.css
813821
814822
}
815-
^^^^^ 2: source.css.tailwind meta.property-list.css
816-
^ 1: punctuation.section.property-list.end.bracket.curly.css
823+
^^^^^ 2: source.css.tailwind meta.at-rule.theme.body.tailwind
824+
^ 1: punctuation.section.theme.end.bracket.curly.tailwind
817825
818826
50% {
819827
^^^^^^^^^ 2: source.css.tailwind

packages/vscode-tailwindcss/syntaxes/at-rules.tmLanguage.json

Lines changed: 49 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -190,7 +190,55 @@
190190
"end": "(?<=}|;)(?!\\G)",
191191
"patterns": [
192192
{
193-
"include": "source.css#rule-list"
193+
"include": "#prefix-meta-fn"
194+
},
195+
{
196+
"match": "\\s+",
197+
"name": "variable.other.css"
198+
},
199+
{
200+
"match": "reference",
201+
"name": "variable.other.css"
202+
},
203+
{
204+
"match": "inline",
205+
"name": "variable.other.css"
206+
},
207+
{
208+
"match": "static",
209+
"name": "variable.other.css"
210+
},
211+
{
212+
"match": "default",
213+
"name": "variable.other.css"
214+
},
215+
{
216+
"match": "deprecated",
217+
"name": "variable.other.css"
218+
},
219+
{
220+
"match": "[^{\\s]+",
221+
"name": "invalid.illegal.invalid-theme.css"
222+
},
223+
{
224+
"begin": "{",
225+
"beginCaptures": {
226+
"0": {
227+
"name": "punctuation.section.theme.begin.bracket.curly.tailwind"
228+
}
229+
},
230+
"end": "}",
231+
"endCaptures": {
232+
"0": {
233+
"name": "punctuation.section.theme.end.bracket.curly.tailwind"
234+
}
235+
},
236+
"name": "meta.at-rule.theme.body.tailwind",
237+
"patterns": [
238+
{
239+
"include": "#property-list"
240+
}
241+
]
194242
}
195243
]
196244
},

0 commit comments

Comments
 (0)