122 lines
2.1 KiB
Text
122 lines
2.1 KiB
Text
|
|
.unary {
|
|
// all operators are parsable as unary operators, anything
|
|
// but - throws an error right now though,
|
|
|
|
// this gives two numbers
|
|
sub: 10 -5;
|
|
// add: 10 +5; // error
|
|
// div: 10 /5; // error
|
|
// mul: 10 *5; // error
|
|
}
|
|
|
|
.spaces {
|
|
// we can make the parser do math by leaving out the
|
|
// space after the first value, or putting spaces on both sides
|
|
|
|
sub1: 10-5;
|
|
sub2: 10 - 5;
|
|
|
|
add1: 10+5;
|
|
add2: 10 + 5;
|
|
|
|
// div: 10/5; // this wont work, read on
|
|
div: 10 / 5;
|
|
|
|
mul1: 10*5;
|
|
mul2: 10 * 5;
|
|
}
|
|
|
|
// these properties have divison not in parenthases
|
|
.supress-division {
|
|
border-radius: 10px / 10px;
|
|
border-radius: 10px/12px;
|
|
border-radius: hello (10px/10px) world;
|
|
@x: 10px;
|
|
font: @x/30 sans-serif;
|
|
font: 10px / 20px sans-serif;
|
|
font: 10px/22px sans-serif;
|
|
border-radius:0 15px 15px 15px / 0 50% 50% 50%;
|
|
}
|
|
|
|
|
|
.parens {
|
|
// if you are unsure, then just wrap the expression in parentheses and it will
|
|
// always evaluate.
|
|
|
|
// notice we no longer have unary operators, and these will evaluate
|
|
sub: (10 -5);
|
|
add: (10 +5);
|
|
div1: (10 /5);
|
|
div2: (10/5); // no longer interpreted as the shorthand
|
|
mul: (10 *5);
|
|
}
|
|
|
|
.keyword-names {
|
|
// watch out when doing math with keywords, - is a valid keyword character
|
|
@a: 100;
|
|
@b: 25;
|
|
@a-: "hello";
|
|
height: @a-@b; // here we get "hello" 25, not 75
|
|
}
|
|
|
|
|
|
.negation {
|
|
neg1: -(1px);
|
|
neg2: 0-(1px);
|
|
|
|
@something: 10;
|
|
neg3: -@something;
|
|
}
|
|
|
|
|
|
// and now here are the tests
|
|
|
|
.test {
|
|
single1: (5);
|
|
single2: 5+(5);
|
|
single3: (5)+((5));
|
|
|
|
parens: (5 +(5)) -2;
|
|
// parens: ((5 +(5)) -2); // FAILS - fixme
|
|
|
|
math1: (5 + 5)*(2 / 1);
|
|
math2: (5+5)*(2/1);
|
|
|
|
complex1: 2 * (4 * (2 + (1 + 6))) - 1;
|
|
complex2: ((2+3)*(2+3) / (9-4)) + 1;
|
|
complex3: (2px + 4px) 1em 2px 2;
|
|
|
|
@var: (2 * 2);
|
|
var1: (2 * @var) 4 4 (@var * 1px);
|
|
var2: (@var * @var) * 6;
|
|
var3: 4 * (5 + 5) / 2 - (@var * 2);
|
|
|
|
complex4: (7 * 7) + (8 * 8);
|
|
}
|
|
|
|
.percents {
|
|
p1: 100 * 10%;
|
|
p2: 10% * 100;
|
|
p3: 10% * 10%;
|
|
|
|
p4: 100px * 10%; // lessjs makes this px
|
|
p5: 10% * 100px; // lessjs makes this %
|
|
|
|
p6: 20% + 10%;
|
|
p7: 20% - 10%;
|
|
|
|
p8: 20% / 10%;
|
|
}
|
|
|
|
.misc {
|
|
x: 10px * 4em;
|
|
y: 10 * 4em;
|
|
}
|
|
|
|
|
|
.cond {
|
|
c1: 10 < 10;
|
|
c2: 10 >= 10;
|
|
}
|
|
|