Skip to content

Commit e6ae9f4

Browse files
committed
Fix interpolation issues
1 parent 90ce805 commit e6ae9f4

File tree

2 files changed

+106
-2
lines changed

2 files changed

+106
-2
lines changed

PostCSS.sublime-syntax

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,11 @@ file_extensions:
1111
- postcss
1212

1313
variables:
14-
ident_start: (?:{{nmstart}}|\$\()
14+
15+
## CSS
16+
17+
# Identifiers
18+
ident_start: (?:{{nmstart}}|{{interpolation_start}})
1519

1620
# Properties and Selectors
1721
property_or_selector_begin: (?={{ident_begin}}|{{selector_start}})
@@ -20,6 +24,14 @@ variables:
2024
selector_start: '[[:alpha:].:#&*\[{{combinator_char}}]'
2125
selector_end: (?=[;@(){}])
2226

27+
# Foreign Tags
28+
tag_name_begin: (?={{tag_name_start}})
29+
tag_name_start: (?:[[:alpha:]]|{{interpolation_start}})
30+
31+
## PostCSS
32+
33+
interpolation_start: \$\(
34+
2335
contexts:
2436

2537
###[ CSS ]#####################################################################
@@ -110,6 +122,14 @@ contexts:
110122
- include: comments
111123
- include: else-pop
112124

125+
selector-tag-content:
126+
- meta_prepend: true
127+
- include: postcss-interpolations
128+
129+
attribute-selector-unquoted-value-content:
130+
- meta_prepend: true
131+
- include: postcss-string-interpolations
132+
113133
property-list-body:
114134
# required until ST4174 (PR #3898)
115135
- meta_scope: meta.property-list.css meta.block.css
@@ -132,11 +152,15 @@ contexts:
132152
- meta_prepend: true
133153
- include: postcss-interpolations
134154

155+
line-name-content:
156+
- meta_prepend: true
157+
- include: postcss-string-interpolations
158+
135159
string-content:
136160
- meta_prepend: true
137161
- include: postcss-string-interpolations
138162

139-
values:
163+
value-prototype:
140164
- meta_prepend: true
141165
- include: postcss-variables
142166

tests/syntax_test.postcss

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,86 @@ $column: 200px;
150150
// ^ punctuation.terminator.rule.css
151151
}
152152

153+
$(tag) > .$(cls) > #$(id) : $(pseudo) [$(attr)=$(value)] { $(prop): $(value); grid: [$(title)] "$(sym)" $width [line$(name)];
154+
//^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.selector.css
155+
//^^^^ entity.name.tag.other.css meta.interpolation.postcss
156+
//^^^ variable.other.postcss
157+
// ^ punctuation.section.interpolation.end.postcss
158+
// ^ keyword.operator.combinator.css
159+
// ^^^^^^^ entity.other.attribute-name.class.css
160+
// ^ punctuation.definition.entity.css
161+
// ^^^^^^ meta.interpolation.postcss
162+
// ^^ punctuation.section.interpolation.begin.postcss
163+
// ^^^ variable.other.postcss
164+
// ^ punctuation.section.interpolation.end.postcss
165+
// ^ keyword.operator.combinator.css
166+
// ^^^^^^ entity.other.attribute-name.id.css
167+
// ^ punctuation.definition.entity.css
168+
// ^^^^^ meta.interpolation.postcss
169+
// ^^ punctuation.section.interpolation.begin.postcss
170+
// ^^ variable.other.postcss
171+
// ^ punctuation.section.interpolation.end.postcss
172+
// ^ punctuation.definition.pseudo-class.css
173+
// ^^^^^^^^^ entity.name.tag.other.css meta.interpolation.postcss
174+
// ^^ punctuation.section.interpolation.begin.postcss
175+
// ^^^^^^ variable.other.postcss
176+
// ^ punctuation.section.interpolation.end.postcss
177+
// ^^^^^^^^^^^^^^^^^^ meta.attribute-selector.css meta.brackets.css
178+
// ^ punctuation.section.brackets.begin.css
179+
// ^^^^^^^ entity.other.attribute-name.css meta.interpolation.postcss
180+
// ^^ punctuation.section.interpolation.begin.postcss
181+
// ^^^^ variable.other.postcss
182+
// ^ punctuation.section.interpolation.end.postcss
183+
// ^ keyword.operator.logical.css
184+
// ^^^^^^^^ meta.string.css meta.interpolation.postcss
185+
// ^^ punctuation.section.interpolation.begin.postcss
186+
// ^^^^^ variable.other.postcss
187+
// ^ punctuation.section.interpolation.end.postcss
188+
// ^ punctuation.section.brackets.end.css
189+
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.property-list.css meta.block.css
190+
// ^ punctuation.section.block.begin.css
191+
// ^^^^^^^ meta.property-name.css support.type.property-name.css meta.interpolation.postcss
192+
// ^^ punctuation.section.interpolation.begin.postcss
193+
// ^^^^ variable.other.postcss
194+
// ^ punctuation.section.interpolation.end.postcss
195+
// ^ punctuation.separator.key-value.css
196+
// ^^^^^^^^^ meta.property-value.css
197+
// ^^^^^^^^ support.constant.property-value.css meta.interpolation.postcss
198+
// ^^ punctuation.section.interpolation.begin.postcss
199+
// ^^^^^ variable.other.postcss
200+
// ^ punctuation.section.interpolation.end.postcss
201+
// ^ punctuation.terminator.rule.css
202+
// ^^^^ meta.property-name.css support.type.property-name.css
203+
// ^ punctuation.separator.key-value.css
204+
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.property-value.css
205+
// ^^^^^^^^^^ meta.line-names.css meta.brackets.css
206+
// ^ punctuation.section.brackets.begin.css
207+
// ^^^^^^^^ meta.string.css meta.interpolation.postcss
208+
// ^^ punctuation.section.interpolation.begin.postcss
209+
// ^^^^^ variable.other.postcss
210+
// ^ punctuation.section.interpolation.end.postcss
211+
// ^ punctuation.section.brackets.end.css
212+
// ^^^^^^^^ meta.string.css
213+
// ^ string.quoted.double.css punctuation.definition.string.begin.css
214+
// ^^^^^^ meta.interpolation.postcss
215+
// ^^ punctuation.section.interpolation.begin.postcss
216+
// ^^^ variable.other.postcss
217+
// ^ punctuation.section.interpolation.end.postcss
218+
// ^ string.quoted.double.css punctuation.definition.string.end.css
219+
// ^^^^^^ variable.other.postcss
220+
// ^ punctuation.definition.variable.postcss
221+
// ^^^^^^^^^^^^^ meta.line-names.css meta.brackets.css
222+
// ^ punctuation.section.brackets.begin.css
223+
// ^^^^^^^^^^^ meta.string.css
224+
// ^^^^ string.unquoted.line-name.css
225+
// ^^^^^^^ meta.interpolation.postcss
226+
// ^^ punctuation.section.interpolation.begin.postcss
227+
// ^^^^ variable.other.postcss
228+
// ^ punctuation.section.interpolation.end.postcss
229+
// ^ punctuation.section.brackets.end.css
230+
// ^ punctuation.terminator.rule.css
231+
}
232+
153233
/*
154234
* https://github.com/pascalduez/postcss-apply
155235
*/

0 commit comments

Comments
 (0)