less 2.2.2 → 2.6.0

data/lib/less/js/test/less/mixins-guards.less

@@ -43,6 +43,9 @@
 .ops (@a) when (@a =< 0) {
   height: lt-or-eq;
 }
+.ops (@a) when (@a <= 0) {
+  height: lt-or-eq-alias;
+}
 .ops (@a) when not(@a = 0) {
   height: not-eq;
 }
@@ -92,3 +95,65 @@
 .bool () when not (false) and (false), not (false)           { content: not false and false, not false }
 
 .bool1 { .bool }
+
+.equality-unit-test(@num) when (@num = 1%) {
+  test: fail;
+}
+.equality-unit-test(@num) when (@num = 2) {
+  test: pass;
+}
+.equality-units {
+  .equality-unit-test(1px);
+  .equality-unit-test(2px);
+}
+
+.colorguard(@col) when (@col = red)							{ content: is @col; }
+.colorguard(@col) when not (blue = @col)					{ content: is not blue its @col; }
+.colorguard(@col)											{}
+.colorguardtest {
+    .colorguard(red);
+	.colorguard(blue);
+	.colorguard(purple);
+}
+
+.stringguard(@str) when (@str = "theme1")					{ content: is theme1; }
+.stringguard(@str) when not ("theme2" = @str)				{ content: is not theme2; }
+.stringguard(@str) when (~"theme1" = @str)					{ content: is theme1 no quotes; }
+.stringguard(@str)											{}
+.stringguardtest {
+    .stringguard("theme1");
+	.stringguard("theme2");
+	.stringguard(theme1);
+}
+
+.mixin(...) {
+  catch:all;
+}
+.mixin(@var) when (@var=4) {
+  declare: 4;
+}
+.mixin(@var) when (@var=4px) {
+  declare: 4px;
+}
+#tryNumberPx {
+  .mixin(4px);
+}
+
+.lock-mixin(@a) {
+ .inner-locked-mixin(@x: @a) when (@a = 1) {
+    a: @a;
+    x: @x;
+  }
+}
+.call-lock-mixin {
+  .lock-mixin(1);
+  .call-inner-lock-mixin {
+    .inner-locked-mixin();
+  }
+}
+.bug-100cm-1m(@a) when (@a = 1) {
+  .failed {
+    one-hundred: not-equal-to-1;
+  }
+}
+.bug-100cm-1m(100cm);

data/lib/less/js/test/less/mixins-important.less

@@ -1,10 +1,17 @@
-
+.submixin(@a) {
+  border-width: @a;
+}
 .mixin (9) {
   border: 9 !important;  
 }
 .mixin (@a: 0) {
   border: @a;
   boxer: @a;
+  .inner {
+    test: @a;
+  }
+  // comment
+  .submixin(@a);
 }
 
 .class {

data/lib/less/js/test/less/mixins-interpolated.less

@@ -0,0 +1,69 @@
+
+@a1: foo;
+@a2: ~".foo";
+@a4: ~"#foo";
+
+.@{a1} {
+    a: 1;
+}
+
+@{a2} {
+    a: 2;
+}
+
+#@{a1} {
+    a: 3;
+}
+
+@{a4} {
+    a: 4;
+}
+
+mi-test-a {
+    .foo;
+    #foo;
+}
+
+.b .bb {
+    &.@{a1}-xxx .yyy-@{a1}@{a4} {
+        & @{a2}.bbb {
+            b: 1;
+        }
+    }
+}
+
+mi-test-b {
+    .b.bb.foo-xxx.yyy-foo#foo.foo.bbb;
+}
+
+@c1: @a1;
+@c2: bar;
+@c3: baz;
+
+#@{c1}-foo {
+    > .@{c2} {
+        .@{c3} {
+            c: c;
+        }
+    }
+}
+
+mi-test-c {
+    &-1 {#foo-foo;}
+    &-2 {#foo-foo > .bar;}
+    &-3 {#foo-foo > .bar.baz;}
+}
+
+.Person(@name, @gender_) {
+    .@{name} {
+        @gender: @gender_;
+        .sayGender() {
+            gender: @gender;
+        }
+    }
+}
+
+mi-test-d {
+    .Person(person, "Male");
+    .person.sayGender();
+}

data/lib/less/js/test/less/mixins-named-args.less

@@ -0,0 +1,36 @@
+.mixin (@a: 1px, @b: 50%) {
+  width: (@a * 5);
+  height: (@b - 1%);
+  args: @arguments;
+}
+.mixin (@a: 1px, @b: 50%) when (@b > 75%){
+  text-align: center;
+}
+ 
+.named-arg {
+  color: blue;
+  .mixin(@b: 100%);
+}
+ 
+.class {
+  @var: 20%;
+  .mixin(@b: @var);
+}
+
+.all-args-wrong-args {
+  .mixin(@b: 10%, @a: 2px);
+}
+
+.mixin2 (@a: 1px, @b: 50%, @c: 50) {
+  width: (@a * 5);
+  height: (@b - 1%);
+  color: (#000000 + @c);
+}
+
+.named-args2 {
+  .mixin2(3px, @c: 100);
+}
+
+.named-args3 {
+  .mixin2(@b: 30%, @c: #123456);
+}

data/lib/less/js/test/less/mixins-nested.less

@@ -4,11 +4,11 @@
 
 .mix (@a: 10) {
   .inner {
-    height: @a * 10;
+    height: (@a * 10);
 
     .innest {
       width: @a;  
-      .mix-inner(@a * 2);
+      .mix-inner((@a * 2));
     }  
   }
 }

data/lib/less/js/test/less/mixins-pattern.less

@@ -1,6 +1,9 @@
 .mixin (...) {
   variadic: true;
 }
+.mixin (@a...) {
+  named-variadic: true;
+}
 .mixin () {
     zero: 0;
 }
@@ -79,7 +82,7 @@
 
 
 .border-radius (@r) {
-    both: @r * 10;
+    both: (@r * 10);
 }
 .border-radius (@r, left) {
     left: @r;

data/lib/less/js/test/less/mixins.less

@@ -58,10 +58,84 @@
 .jo.ki {
     background: none;
 }
+.amp {
+    &.support {
+        color: orange;
+        .higher {
+            top: 0px;
+        }
+        &.deeper {
+            height: auto;
+        }
+    }
+}
 .extended {
     .bo;
     .jo.ki;
+    .amp.support;
+    .amp.support.higher;
+    .amp.support.deeper;
+}
+.do .re .mi .fa {
+    .sol .la {
+        .si {
+            color: cyan;
+        }
+    }
+}
+.mutli-selector-parents {
+    .do.re.mi.fa.sol.la.si;
 }
 .foo .bar {
   .bar;
 }
+.has_parents() {
+  & .underParents {
+    color: red;
+  }
+}
+.has_parents();
+.parent {
+  .has_parents();
+}
+.margin_between(@above, @below) {
+     * + & { margin-top: @above; }
+     legend + & { margin-top: 0; }
+     & + * { margin-top: @below; }
+}
+h1 { .margin_between(25px, 10px); }
+h2 { .margin_between(20px, 8px); }
+h3 { .margin_between(15px, 5px); }
+
+.mixin_def(@url, @position){
+    background-image: @url;
+    background-position: @position;
+}
+.error{
+  @s: "/";
+  .mixin_def( "@{s}a.png", center center);
+}
+.recursion() {
+  color: black;
+}
+.test-rec {
+  .recursion {
+    .recursion();
+  }
+}
+.paddingFloat(@padding) { padding-left: @padding; }
+
+.button { 
+    .paddingFloat(((10px + 12) * 2));
+
+    &.large { .paddingFloat(((10em * 2) * 2)); }
+}
+.clearfix() {
+  // ...
+}
+.clearfix {
+  .clearfix();
+}
+.foo {
+  .clearfix();
+}

data/lib/less/js/test/less/modifyVars/extended.json

@@ -0,0 +1,5 @@
+{
+    "the-border": "1px",
+    "base-color": "#111",
+    "red": "#842210"
+}

data/lib/less/js/test/less/modifyVars/extended.less

@@ -0,0 +1,11 @@
+#header {
+  color: (@base-color * 3);
+  border-left: @the-border;
+  border-right: (@the-border * 2);
+}
+#footer {
+  color: (@base-color + #003300);
+  border-color: @red;
+}
+@red: blue; // var is overridden by the modifyVars
+//@base-color: green;

data/lib/less/js/test/less/no-js-errors/no-js-errors.less

@@ -0,0 +1,3 @@
+.a {
+  a: `1 + 1`;
+}

data/lib/less/js/test/less/no-js-errors/no-js-errors.txt

@@ -0,0 +1,4 @@
+SyntaxError: You are using JavaScript, which has been disabled. in {path}no-js-errors.less on line 2, column 6:
+1 .a {
+2   a: `1 + 1`;
+3 }

data/lib/less/js/test/less/no-output.less

@@ -0,0 +1,2 @@
+.mixin() {
+}

data/lib/less/js/test/less/operations.less

@@ -1,35 +1,35 @@
 #operations {
-  color: #110000 + #000011 + #001100; // #111111
-  height: 10px / 2px + 6px - 1px * 2; // 9px
-  width: 2 * 4 - 5em; // 3em
+  color: (#110000 + #000011 + #001100); // #111111
+  height: (10px / 2px + 6px - 1px * 2); // 9px
+  width: (2 * 4 - 5em); // 3em
   .spacing {
-    height: 10px / 2px+6px-1px*2;
-    width: 2  * 4-5em;
+    height: (10px / 2px+6px-1px*2);
+    width: (2  * 4-5em);
   }
-  substraction: 20 - 10 - 5 - 5; // 0
-  division: 20 / 5 / 4; // 1
+  substraction: (20 - 10 - 5 - 5); // 0
+  division: (20 / 5 / 4); // 1
 }
 
 @x: 4;
 @y: 12em;
 
 .with-variables {
-  height: @x + @y; // 16em
-  width: 12 + @y; // 24em
-  size: 5cm - @x; // 1cm
+  height: (@x + @y); // 16em
+  width: (12 + @y); // 24em
+  size: (5cm - @x); // 1cm
 }
 
 .with-functions {
-  color: rgb(200, 200, 200) / 2;
-  color: 2 * hsl(0, 50%, 50%);
-  color: rgb(10, 10, 10) + hsl(0, 50%, 50%);
+  color: (rgb(200, 200, 200) / 2);
+  color: (2 * hsl(0, 50%, 50%));
+  color: (rgb(10, 10, 10) + hsl(0, 50%, 50%));
 }
 
 @z: -2;
 
 .negative {
-  height: 2px + @z; // 0px
-  width: 2px - @z; // 4px
+  height: (2px + @z); // 0px
+  width: (2px - @z); // 4px
 }
 
 .shorthands {
@@ -37,26 +37,26 @@
 }
 
 .rem-dimensions {
-  font-size: 20rem / 5 + 1.5rem; // 5.5rem
+  font-size: (20rem / 5 + 1.5rem); // 5.5rem
 }
 
 .colors {
   color: #123; // #112233
-  border-color: #234 + #111111; // #334455
-  background-color: #222222 - #fff; // #000000
+  border-color: (#234 + #111111); // #334455
+  background-color: (#222222 - #fff); // #000000
   .other {
-    color: 2 * #111; // #222222
-    border-color: #333333 / 3 + #111; // #222222
+    color: (2 * #111); // #222222
+    border-color: (#333333 / 3 + #111); // #222222
   }
 }
 
 .negations {
     @var: 4px;
-    variable: -@var; // 4
-    variable1: -@var + @var; // 0
-    variable2: @var + -@var; // 0
-    variable3: @var - -@var; // 8
-    variable4: -@var - -@var; // 0
-    paren: -(@var); // -4px
-    paren2: -(2 + 2) * -@var; // 16
+    variable: (-@var); // 4
+    variable1: (-@var + @var); // 0
+    variable2: (@var + -@var); // 0
+    variable3: (@var - -@var); // 8
+    variable4: (-@var - -@var); // 0
+    paren: (-(@var)); // -4px
+    paren2: (-(2 + 2) * -@var); // 16
 }

data/lib/less/js/test/less/parens.less

@@ -3,24 +3,43 @@
   border: (@var * 2) solid black;
   margin: (@var * 1) (@var + 2) (4 * 4) 3;
   width: (6 * 6);
-  padding: 2px (6px * 6px);
+  padding: 2px (6 * 6px);
 }
 
 .more-parens {
   @var: (2 * 2);
   padding: (2 * @var) 4 4 (@var * 1px);
-  width: (@var * @var) * 6;
-  height: (7 * 7) + (8 * 8);
-  margin: 4 * (5 + 5) / 2 - (@var * 2);
+  width-all: ((@var * @var) * 6);
+  width-first: ((@var * @var)) * 6;
+  width-keep: (@var * @var) * 6;
+  height-keep: (7 * 7) + (8 * 8);
+  height-all: ((7 * 7) + (8 * 8));
+  height-parts: ((7 * 7)) + ((8 * 8));
+  margin-keep: (4 * (5 + 5) / 2) - (@var * 2);
+  margin-parts: ((4 * (5 + 5) / 2)) - ((@var * 2));
+  margin-all: ((4 * (5 + 5) / 2) + (-(@var * 2)));
+  border-radius-keep: 4px * (1 + 1) / @var + 3px;
+  border-radius-parts: ((4px * (1 + 1))) / ((@var + 3px));
+  border-radius-all: (4px * (1 + 1) / @var + 3px);
   //margin: (6 * 6)px;
 }
 
+.negative {
+  @var: 1;
+  neg-var: -@var; // -1 ?
+  neg-var-paren: -(@var); // -(1) ?
+}
+
 .nested-parens {
   width: 2 * (4 * (2 + (1 + 6))) - 1;
-  height: ((2+3)*(2+3) / (9-4)) + 1;
+  height: ((2 + 3) * (2 + 3) / (9 - 4)) + 1;
 }
 
 .mixed-units {
   margin: 2px 4em 1 5pc;
   padding: (2px + 4px) 1em 2px 2;
 }
+
+.test-false-negatives {
+  a: ~"(";
+}

data/lib/less/js/test/less/property-name-interp.less

@@ -0,0 +1,53 @@
+
+pi-test {
+    @prefix: ufo-;
+    @a:    border;
+    @bb:      top;
+    @c_c:    left;
+    @d-d4: radius;
+    @-:         -;
+    
+    @{a}: 0;
+    @{prefix}width: 50%;
+    *-z-@{a} :1px dashed blue;
+    -www-@{a}-@{bb}: 2px;
+    @{d-d4}-is-not-a-@{a}:true;
+    @{a}-@{bb}-@{c_c}-@{d-d4}       : 2em;
+    @{a}@{-}@{bb}@{-}red@{-}@{d-d4}-: 3pt;
+
+    .mixin(mixer);
+    .merge(ish, base);
+}
+
+@global: global;
+
+.mixin(@arg) {
+    @local: local;
+    @{global}-@{local}-@{arg}-property: strong;
+}
+
+.merge(@p, @v) {
+    &-merge {
+        @prefix: pre;
+        @suffix: ish;
+        @{prefix}-property-ish+       :high;
+        pre-property-@{suffix}    +: middle;
+        @{prefix}-property-@{suffix}+:  low;
+        @{prefix}-property-@{p}   +  :   @v;
+    
+        @subterfuge: ~'+';
+        pre-property-ish@{subterfuge}: nice try dude;
+    }
+}
+
+pi-indirect-vars {
+    @{p}: @p;
+    @p: @@a;
+    @a: b;
+    @b: auto;
+}
+
+pi-complex-values {
+    @{p}@{p}: none;
+    @p: (1 + 2px) fadeout(#ff0, 50%), pi() /* foo */;
+}

data/lib/less/js/test/less/scope.less

@@ -1,3 +1,4 @@
+@x: red;
 @x: blue;
 @z: transparent;
 @mix: none;
@@ -5,7 +6,7 @@
 .mixin {
   @mix: #989;
 }
-
+@mix: blue;
 .tiny-scope {
   color: @mix; // #989
   .mixin;
@@ -30,3 +31,74 @@
     }
   }
 }
+
+#namespace {
+  .scoped_mixin() {
+    @local-will-be-made-global: green;
+    .scope {
+      scoped-val: @local-will-be-made-global;
+	}
+  }
+}
+
+#namespace > .scoped_mixin();
+
+.setHeight(@h) { @height: 1024px; }
+.useHeightInMixinCall(@h) { .useHeightInMixinCall { mixin-height: @h; } }
+@mainHeight: 50%;
+.setHeight(@mainHeight);
+.heightIsSet { height: @height; }
+.useHeightInMixinCall(@height);
+
+.importRuleset() {
+  .imported {
+    exists: true;
+  }
+}
+.importRuleset();
+.testImported {
+  .imported;
+}
+
+@parameterDefault: 'top level';
+@anotherVariable: 'top level';
+//mixin uses top-level variables
+.mixinNoParam(@parameter: @parameterDefault) when (@parameter = 'top level') {
+  default: @parameter;
+  scope: @anotherVariable;
+  sub-scope-only: @subScopeOnly;
+}
+
+#allAreUsedHere {
+  //redefine top-level variables in different scope
+  @parameterDefault: 'inside';
+  @anotherVariable: 'inside';
+  @subScopeOnly: 'inside';
+  //use the mixin
+  .mixinNoParam();
+}
+#parentSelectorScope {
+  @col: white;
+  & {
+    @col: black;
+  }
+  prop: @col;
+  & {
+    @col: black;
+  }
+}
+.test-empty-mixin() {
+}
+#parentSelectorScopeMixins {
+  & {
+    .test-empty-mixin() {
+      should: never seee 1;
+    }
+  }
+  .test-empty-mixin();
+  & {
+    .test-empty-mixin() {
+      should: never seee 2;
+    }
+  }
+}