Skip to content

Commit 313d888

Browse files
committed
sort and clean tests, fix #90 &-bem selectors
1 parent 56a0312 commit 313d888

File tree

2 files changed

+99
-106
lines changed

2 files changed

+99
-106
lines changed

LESS.sublime-syntax

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -491,7 +491,7 @@ contexts:
491491
pop: true
492492
- include: selector
493493
- match: '(-+|_+)[a-zA-Z_][a-zA-Z0-9_-]*'
494-
scope: entity.other.attribute-name.css
494+
scope: meta.selector.css entity.other.attribute-name.css
495495
- match: '([\.#])(?![0-9])[a-zA-Z0-9_-]+(?=\()'
496496
scope: meta.selector.css entity.other.attribute-name.class.css entity.other.less.mixin
497497
captures:

syntax_test_less.less

Lines changed: 98 additions & 105 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,5 @@
11
// SYNTAX TEST "Packages/LESS/LESS.sublime-syntax"
22

3-
@import (reference) "@{themes}/tidal-wave.less";
4-
// ^^^^^^^^^^^ meta.at-rule.css meta.group.less meta.function.parameters.less
5-
// ^ punctuation.definition.group.begin.less
6-
// ^ punctuation.definition.group.end.less
7-
// ^ variable.other.less punctuation.definition.variable.less
8-
// ^ string.quoted.double.css variable.other.less string.interpolated.less
9-
// ^ punctuation.terminator.statement.css
10-
@import "mixins";
11-
// <- meta.at-rule.css keyword.control.at-rule.css punctuation.definition.keyword.css
12-
// ^ meta.at-rule.css keyword.control.at-rule.css
13-
// ^^^^^^^^ string.quoted.double.css
14-
// ^ punctuation.definition.string.begin.css
15-
// ^ punctuation.definition.string.end.css
16-
@import url("https://fonts.googleapis.com/css?family=Source+Code+Pro:400");
17-
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ source.css.less meta.at-rule.css meta.group.css string.quoted.double.css
18-
// ^ punctuation.definition.string.begin.css
19-
// ^ punctuation.definition.string.end.css
20-
@import url(somefile);
21-
// ^ punctuation.definition.group.begin.css
22-
// ^^^ meta.function-call.css support.function.url.css
23-
// ^^^^^^^^ meta.group.css string.unquoted.css
24-
// ^ punctuation.definition.group.end.css
25-
@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,300,500);
26-
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.css string.unquoted.css
27-
283
@foreground-color: grayscale(#333);
294
// <- variable.declaration.less punctuation.definition.variable.less
305
// ^ variable.declaration.less
@@ -41,17 +16,24 @@
4116

4217

4318
filter,
44-
// ^ entity.name.tag.css
19+
// ^^^ meta.selector.css entity.name.tag.css
20+
// ^ punctuation.separator.css - meta.selector.css
4521
filter {}
22+
// ^ - meta.selector.css
4623
// ^ entity.name.tag.css
4724
filter{}
4825
// ^ entity.name.tag.css
4926
#main h1+.sub {
27+
// <- entity.other.attribute-name.id.css punctuation.definition.entity.css
28+
// ^^ entity.other.attribute-name.id.css
5029
// ^^ meta.selector.css entity.name.tag.css
30+
// ^ - meta.selector.css
5131
// ^ - constant.numeric
5232
// ^ punctuation.section.property-list.begin.css
5333
filter::before {}
5434
// ^ entity.name.tag.css
35+
// ^^^^^^^^ entity.other.pseudo-element.css
36+
// ^^ punctuation.definition.entity.css
5537
// ^ punctuation.section.property-list.begin.css
5638
// ^ punctuation.section.property-list.end.css
5739
html{}
@@ -60,12 +42,20 @@ html:after,
6042
// ^ entity.other.pseudo-element.css punctuation.definition.entity.css
6143
// ^ entity.other.pseudo-element.css
6244
html:hover,
45+
// ^ entity.name.tag.css
6346
// ^ entity.other.pseudo-class.css punctuation.definition.entity.css
6447
// ^ entity.other.pseudo-class.css
6548
html::before {
6649
// ^ entity.name.tag.css, keyword.control.html.elements
6750
// ^^ entity.other.pseudo-element.css punctuation.definition.entity.css
6851
// ^ entity.other.pseudo-element.css
52+
&:first-child {}
53+
//^^^^^^^^^^^^^ meta.selector.css
54+
// ^^^^^^^^^^^^ entity.other.pseudo-class.css
55+
//^ keyword.operator.ampersand.less
56+
// ^ punctuation.definition.entity.css
57+
& + & {}
58+
// ^ punctuation.separator.combinator.css
6959
font-family: 'Lucida Grande', Verdana, sans-serif;
7060
font-size: 16px;
7161
line-height: ~"calc(@{space} + 4px)";
@@ -113,16 +103,6 @@ html::before {
113103
// ^ meta.property-value.css support.constant.color.w3c-standard-color-name.css
114104
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.3));
115105
// ^ support.type.property-name.css
116-
filter,
117-
// ^ entity.name.tag.css
118-
filter {}
119-
// ^ entity.name.tag.css
120-
filter{}
121-
// ^ entity.name.tag.css
122-
filter:hover {}
123-
// ^ entity.name.tag.css
124-
filter::before {}
125-
// ^ entity.name.tag.css
126106

127107
.fade-in(@selector) {
128108
@keyframes fade-in-animation {
@@ -146,8 +126,6 @@ html::before {
146126
}
147127
}
148128
}
149-
a[value="text"], a[value="text"] { }
150-
// ^ punctuation.definition.entity.css
151129
a[data-property="text"] {
152130
// ^^^^^^^^^^^^^^^^^^^^^^ meta.attribute-selector.css
153131
// ^ punctuation.definition.entity.css
@@ -160,6 +138,8 @@ html::before {
160138
a[value^="text"] {
161139
// ^ meta.attribute-selector.css entity.other.attribute-name.css
162140
// ^ meta.attribute-selector.css keyword.operator.attribute-selector.css
141+
a[value="text"], a[value="text"] { }
142+
// ^ punctuation.definition.entity.css
163143
a[href~="#"] {
164144
// ^ meta.attribute-selector.css keyword.operator.attribute-selector.css
165145
a[value|='text'] {
@@ -209,10 +189,63 @@ html::before {
209189
}
210190

211191

192+
#variables {
193+
@variable: 10px;
194+
@another-variable: @variable;
195+
196+
width: @variable + @another-variable;
197+
width: @variable*2;
198+
199+
.@{varname}--subclass#another@{variable}id[data-attr="text"] { color: @orangy; }
200+
// ^ entity.other.attribute-name.class.css
201+
// ^ entity.other.attribute-name.id.css punctuation.definition.entity.css
202+
// ^ entity.other.attribute-name.id.css variable.other.less punctuation.definition.variable.less
203+
// ^ entity.other.attribute-name.id.css
204+
}
205+
#@{varname}--subclass { color: @orangy; }
206+
// ^ entity.other.attribute-name.id.css
207+
208+
.use-mixin {
209+
// ^^^^^^^ meta.selector.css entity.other.attribute-name.class.css
210+
&--bem {}
211+
// ^^^^^ meta.selector.css entity.other.attribute-name
212+
//^ keyword.operator.ampersand.less
213+
&_bem {}
214+
// ^^^^ meta.selector.css entity.other.attribute-name
215+
// ^ - meta.selector.css
216+
}
217+
.accordion__copy,
218+
// ^^^^^^^^^^^^^ meta.selector.css entity.other.attribute-name.class.css
219+
.accordion__copy--open {}
220+
// ^^^^^^^^^^^^^^^^^^^ meta.selector.css entity.other.attribute-name.class.css
221+
212222
#namespace when (@mode = huge) {
213223
// ^ meta.function.parameters.less keyword.operator.less
214-
.mixin { /* */ }
215-
.mixin() { /* */ }
224+
225+
.a-test-mixin(@color: black; /*@margin: 10px;*/ @padding: 20px) when (lightness(@a) >= 50%) {
226+
// <- entity.other.less.mixin
227+
// ^^^^^^^ entity.other.less.mixin
228+
// ^^^^^^^^^^^^^^^^^^ comment.block.css
229+
// ^^ punctuation.definition.comment.css
230+
// ^^ punctuation.definition.comment.css
231+
// ^^ keyword.operator.less
232+
// ^^ meta.function.parameters.less variable.other.less
233+
// ^ punctuation.definition.variable.less
234+
.nested {
235+
@media screen and (max-width: 100px) {
236+
.mixin(@a) when not (isnumber(@a)) and (@a > 0) ... }
237+
// ^^^^^^ entity.other.less.mixin
238+
// ^^ keyword.operator.less
239+
// ^^^^^^^^ meta.function-call.less support.function.less
240+
}
241+
}
242+
color: mix(@grey4, @grey5);
243+
// ^ meta.property-value.css meta.function-call.less support.function.less
244+
background: mix(@white, mix(@grey4, @grey5));
245+
// ^ meta.property-value.css meta.function-call.less support.function.less
246+
background-color: linear-gradient(@white, mix(@grey4, mix(@grey4, @grey5)));
247+
// ^ meta.property-value.css meta.function-call.less support.function.less
248+
padding: @padding;
216249
}
217250
.mixin(@a) when not (isnumber(@a)) and (@a > 0) ... }
218251
// ^ entity.other.attribute-name.class.css entity.other.less.mixin
@@ -272,6 +305,31 @@ html::before {
272305
// ^ meta.property-value.css meta.group.css string.quoted.single.css punctuation.definition.string.end.css
273306
// ^ meta.property-value.css meta.group.css punctuation.definition.group.end.css
274307
}
308+
@import (reference) "@{themes}/tidal-wave.less";
309+
// ^^^^^^^^^^^ meta.at-rule.css meta.group.less meta.function.parameters.less
310+
// ^ punctuation.definition.group.begin.less
311+
// ^ punctuation.definition.group.end.less
312+
// ^ variable.other.less punctuation.definition.variable.less
313+
// ^ string.quoted.double.css variable.other.less string.interpolated.less
314+
// ^ punctuation.terminator.statement.css
315+
@import "mixins";
316+
// <- meta.at-rule.css keyword.control.at-rule.css punctuation.definition.keyword.css
317+
// ^ meta.at-rule.css keyword.control.at-rule.css
318+
// ^^^^^^^^ string.quoted.double.css
319+
// ^ punctuation.definition.string.begin.css
320+
// ^ punctuation.definition.string.end.css
321+
@import url("https://fonts.googleapis.com/css?family=Source+Code+Pro:400");
322+
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ source.css.less meta.at-rule.css meta.group.css string.quoted.double.css
323+
// ^ punctuation.definition.string.begin.css
324+
// ^ punctuation.definition.string.end.css
325+
@import url(somefile);
326+
// ^ punctuation.definition.group.begin.css
327+
// ^^^ meta.function-call.css support.function.url.css
328+
// ^^^^^^^^ meta.group.css string.unquoted.css
329+
// ^ punctuation.definition.group.end.css
330+
@import url(http://fonts.googleapis.com/css?family=Roboto:400,100,300,500);
331+
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.css string.unquoted.css
332+
275333

276334
// http://lesscss.org/features/#detached-rulesets-feature
277335
header {
@@ -310,68 +368,3 @@ header {
310368
});
311369
//^ punctuation.section.property-list.end.css
312370
}
313-
314-
@import "variables";
315-
@import (reference) "variables";
316-
317-
#variables {
318-
@variable: 10px;
319-
@another-variable: @variable;
320-
321-
width: @variable + @another-variable;
322-
width: @variable*2;
323-
324-
&:first-child {}
325-
326-
.@{varname}--subclass#another@{variable}id[data-attr="text"] { color: @orangy; }
327-
// ^ entity.other.attribute-name.class.css
328-
// ^ entity.other.attribute-name.id.css punctuation.definition.entity.css
329-
// ^ entity.other.attribute-name.id.css variable.other.less punctuation.definition.variable.less
330-
// ^ entity.other.attribute-name.id.css
331-
}
332-
#@{varname}--subclass { color: @orangy; }
333-
// ^ entity.other.attribute-name.id.css
334-
.functions {
335-
color: hue(orange);
336-
color: lighten(@color, 10%);
337-
color: mix(@color, #000, 25%);
338-
width: max(5, 10);
339-
width: unit(.5, px);
340-
}
341-
342-
.nested {
343-
.class {}
344-
&::before {}
345-
//^^^^^^^^^ meta.selector.css
346-
//^ keyword.operator.ampersand.less
347-
& + & {}
348-
// ^ punctuation.separator.combinator.css
349-
.class & {}
350-
@media screen and (max-width: 100px) {
351-
.mixin(@a) when not (isnumber(@a)) and (@a > 0) ... }
352-
}
353-
}
354-
355-
.a-test-mixin(@color: black; /*@margin: 10px;*/ @padding: 20px) when (lightness(@a) >= 50%) {
356-
color: mix(@grey4, @grey5);
357-
// ^ meta.property-value.css meta.function-call.less support.function.less
358-
background: mix(@white, mix(@grey4, @grey5));
359-
// ^ meta.property-value.css meta.function-call.less support.function.less
360-
background-color: linear-gradient(@white, mix(@grey4, mix(@grey4, @grey5)));
361-
// ^ meta.property-value.css meta.function-call.less support.function.less
362-
padding: @padding;
363-
}
364-
365-
.use-mixin {
366-
&--bem {}
367-
&_bem {}
368-
}
369-
370-
.class {}
371-
.extended {
372-
&:extend(.class);
373-
background: blue;
374-
}
375-
376-
.guard() when (lightness(@a) >= 50%) {}
377-
.guard();

0 commit comments

Comments
 (0)