Add formatting libraries to composer.json

This commit is contained in:
Kijin Sung 2016-03-17 20:37:43 +09:00
parent 59ee4a7387
commit 2b008f7be6
202 changed files with 28022 additions and 133 deletions

196
vendor/leafo/lessphp/tests/ApiTest.php vendored Normal file
View file

@ -0,0 +1,196 @@
<?php
require_once __DIR__ . "/../lessc.inc.php";
class ApiTest extends PHPUnit_Framework_TestCase {
public function setUp() {
$this->less = new lessc();
$this->less->importDir = array(__DIR__ . "/inputs/test-imports");
}
public function testPreserveComments() {
$input = <<<EOD
// what is going on?
/** what the heck **/
/**
Here is a block comment
**/
// this is a comment
/*hello*/div /*yeah*/ { //surew
border: 1px solid red; // world
/* comment above the first occurrence of a duplicated rule */
color: url('http://mage-page.com');
string: "hello /* this is not a comment */";
world: "// neither is this";
/* comment above the second occurrence of a duplicated rule */
color: url('http://mage-page.com');
string: 'hello /* this is not a comment */' /*what if this is a comment */;
world: '// neither is this' // hell world;
;
/* duplicate comments are retained */
/* duplicate comments are retained */
what-ever: 100px;
background: url(/*this is not a comment?*/); // uhh what happens here
}
EOD;
$outputWithComments = <<<EOD
/** what the heck **/
/**
Here is a block comment
**/
/*hello*/
/*yeah*/
div /*yeah*/ {
border: 1px solid red;
/* comment above the first occurrence of a duplicated rule */
/* comment above the second occurrence of a duplicated rule */
color: url('http://mage-page.com');
string: "hello /* this is not a comment */";
world: "// neither is this";
/*what if this is a comment */
string: 'hello /* this is not a comment */';
world: '// neither is this';
/* duplicate comments are retained */
/* duplicate comments are retained */
what-ever: 100px;
/*this is not a comment?*/
background: url();
}
EOD;
$outputWithoutComments = <<<EOD
div {
border: 1px solid red;
color: url('http://mage-page.com');
string: "hello /* this is not a comment */";
world: "// neither is this";
string: 'hello /* this is not a comment */';
world: '// neither is this';
what-ever: 100px;
background: url(/*this is not a comment?*/);
}
EOD;
$this->assertEquals($this->compile($input), trim($outputWithoutComments));
$this->less->setPreserveComments(true);
$this->assertEquals($this->compile($input), trim($outputWithComments));
}
public function testOldInterface() {
$this->less = new lessc(__DIR__ . "/inputs/hi.less");
$out = $this->less->parse(array("hello" => "10px"));
$this->assertEquals(trim($out), trim('
div:before {
content: "hi!";
}'));
}
public function testInjectVars() {
$out = $this->less->parse(".magic { color: @color; width: @base - 200; }",
array(
'color' => 'red',
'base' => '960px'
));
$this->assertEquals(trim($out), trim("
.magic {
color: red;
width: 760px;
}"));
}
public function testDisableImport() {
$this->less->importDisabled = true;
$this->assertEquals(
"/* import disabled */",
$this->compile("@import 'file3';"));
}
public function testUserFunction() {
$this->less->registerFunction("add-two", function($list) {
list($a, $b) = $list[2];
return $a[1] + $b[1];
});
$this->assertEquals(
$this->compile("result: add-two(10, 20);"),
"result: 30;");
return $this->less;
}
/**
* @depends testUserFunction
*/
public function testUnregisterFunction($less) {
$less->unregisterFunction("add-two");
$this->assertEquals(
$this->compile("result: add-two(10, 20);"),
"result: add-two(10,20);");
}
public function testFormatters() {
$src = "
div, pre {
color: blue;
span, .big, hello.world {
height: 20px;
color:#ffffff + #000;
}
}";
$this->less->setFormatter("compressed");
$this->assertEquals(
$this->compile($src), "div,pre{color:blue;}div span,div .big,div hello.world,pre span,pre .big,pre hello.world{height:20px;color:#fff;}");
// TODO: fix the output order of tags
$this->less->setFormatter("lessjs");
$this->assertEquals(
$this->compile($src),
"div,
pre {
color: blue;
}
div span,
div .big,
div hello.world,
pre span,
pre .big,
pre hello.world {
height: 20px;
color: #ffffff;
}");
$this->less->setFormatter("classic");
$this->assertEquals(
$this->compile($src),
trim("div, pre { color:blue; }
div span, div .big, div hello.world, pre span, pre .big, pre hello.world {
height:20px;
color:#ffffff;
}
"));
}
public function compile($str) {
return trim($this->less->parse($str));
}
}

View file

@ -0,0 +1,81 @@
<?php
require_once __DIR__ . "/../lessc.inc.php";
class ErrorHandlingTest extends PHPUnit_Framework_TestCase {
public function setUp() {
$this->less = new lessc();
}
public function compile() {
$source = join("\n", func_get_args());
return $this->less->compile($source);
}
/**
* @expectedException Exception
* @expectedExceptionMessage .parametric-mixin is undefined
*/
public function testRequiredParametersMissing() {
$this->compile(
'.parametric-mixin (@a, @b) { a: @a; b: @b; }',
'.selector { .parametric-mixin(12px); }'
);
}
/**
* @expectedException Exception
* @expectedExceptionMessage .parametric-mixin is undefined
*/
public function testTooManyParameters() {
$this->compile(
'.parametric-mixin (@a, @b) { a: @a; b: @b; }',
'.selector { .parametric-mixin(12px, 13px, 14px); }'
);
}
/**
* @expectedException Exception
* @expectedExceptionMessage unrecognised input
*/
public function testRequiredArgumentsMissing() {
$this->compile('.selector { rule: e(); }');
}
/**
* @expectedException Exception
* @expectedExceptionMessage variable @missing is undefined
*/
public function testVariableMissing() {
$this->compile('.selector { rule: @missing; }');
}
/**
* @expectedException Exception
* @expectedExceptionMessage .missing-mixin is undefined
*/
public function testMixinMissing() {
$this->compile('.selector { .missing-mixin; }');
}
/**
* @expectedException Exception
* @expectedExceptionMessage .flipped is undefined
*/
public function testGuardUnmatchedValue() {
$this->compile(
'.flipped(@x) when (@x =< 10) { rule: value; }',
'.selector { .flipped(12); }'
);
}
/**
* @expectedException Exception
* @expectedExceptionMessage .colors-only is undefined
*/
public function testGuardUnmatchedType() {
$this->compile(
'.colors-only(@x) when (iscolor(@x)) { rule: value; }',
'.selector { .colors-only("string value"); }'
);
}
}

View file

@ -0,0 +1,89 @@
<?php
require_once __DIR__ . "/../lessc.inc.php";
// Runs all the tests in inputs/ and compares their output to ouputs/
function _dump($value) {
fwrite(STDOUT, print_r($value, true));
}
function _quote($str) {
return preg_quote($str, "/");
}
class InputTest extends PHPUnit_Framework_TestCase {
protected static $importDirs = array("inputs/test-imports");
protected static $testDirs = array(
"inputs" => "outputs",
"inputs_lessjs" => "outputs_lessjs",
);
public function setUp() {
$this->less = new lessc();
$this->less->importDir = array_map(function($path) {
return __DIR__ . "/" . $path;
}, self::$importDirs);
}
/**
* @dataProvider fileNameProvider
*/
public function testInputFile($inFname) {
if ($pattern = getenv("BUILD")) {
return $this->buildInput($inFname);
}
$outFname = self::outputNameFor($inFname);
if (!is_readable($outFname)) {
$this->fail("$outFname is missing, ".
"consider building tests with BUILD=true");
}
$input = file_get_contents($inFname);
$output = file_get_contents($outFname);
$this->assertEquals($output, $this->less->parse($input));
}
public function fileNameProvider() {
return array_map(function($a) { return array($a); },
self::findInputNames());
}
// only run when env is set
public function buildInput($inFname) {
$css = $this->less->parse(file_get_contents($inFname));
file_put_contents(self::outputNameFor($inFname), $css);
}
static public function findInputNames($pattern="*.less") {
$files = array();
foreach (self::$testDirs as $inputDir => $outputDir) {
$files = array_merge($files, glob(__DIR__ . "/" . $inputDir . "/" . $pattern));
}
return array_filter($files, "is_file");
}
static public function outputNameFor($input) {
$front = _quote(__DIR__ . "/");
$out = preg_replace("/^$front/", "", $input);
foreach (self::$testDirs as $inputDir => $outputDir) {
$in = _quote($inputDir . "/");
$rewritten = preg_replace("/$in/", $outputDir . "/", $out);
if ($rewritten != $out) {
$out = $rewritten;
break;
}
}
$out = preg_replace("/.less$/", ".css", $out);
return __DIR__ . "/" . $out;
}
}

24
vendor/leafo/lessphp/tests/README.md vendored Normal file
View file

@ -0,0 +1,24 @@
lessphp uses [phpunit](https://github.com/sebastianbergmann/phpunit/) for its tests
* `InputTest.php` iterates through all the less files in `inputs/`, compiles
them, then compares the result with the respective file in `outputs/`.
* `ApiTest.php` tests the behavior of lessphp's public API methods.
* `ErrorHandlingTest.php` tests that lessphp throws appropriate errors when
given invalid LESS as input.
From the root you can run `make` to run all the tests.
## lessjs tests
Tests found in `inputs_lessjs` are extracted directly from
[less.js](https://github.com/less/less.js). The following license applies to
those tests: https://github.com/less/less.js/blob/master/LICENSE
## bootstrap.sh
Clones twitter bootsrap, compiles it with lessc and lessphp, cleans up results
with sort.php, and outputs diff. To run it, you need to have git and lessc
installed.

38
vendor/leafo/lessphp/tests/bootstrap.sh vendored Normal file
View file

@ -0,0 +1,38 @@
#!/bin/sh
echo "This script clones Twitter Bootstrap, compiles it with lessc and lessphp,"
echo "cleans up results with sort.php, and outputs diff. To run it, you need to"
echo "have git and lessc installed."
echo ""
if [ -z "$input" ]; then
input="bootstrap/less/bootstrap.less"
fi
dest=$(basename "$input")
dest="${dest%.*}"
if [ -z "$@" ]; then
diff_tool="diff -b -u -t -B"
else
diff_tool=$@
fi
mkdir -p tmp
if [ ! -d 'bootstrap/' ]; then
echo ">> Cloning bootstrap to bootstrap/"
git clone https://github.com/twbs/bootstrap
fi
echo ">> lessc compilation ($input)"
lessc "$input" "tmp/$dest.lessc.css"
echo ">> lessphp compilation ($input)"
../plessc "$input" "tmp/$dest.lessphp.css"
echo ">> Cleanup and convert"
php sort.php "tmp/$dest.lessc.css" > "tmp/$dest.lessc.clean.css"
php sort.php "tmp/$dest.lessphp.css" > "tmp/$dest.lessphp.clean.css"
echo ">> Doing diff"
$diff_tool "tmp/$dest.lessc.clean.css" "tmp/$dest.lessphp.clean.css"

View file

@ -0,0 +1,36 @@
/* accessors */
#defaults {
@width: 960px;
@color: black;
.something {
@space: 10px;
@hello {
color: green;
}
}
}
.article { color: #294366; }
.comment {
width: #defaults[@width];
color: .article['color'];
padding: #defaults > .something[@space];
}
.wow {
height: .comment['width'];
background-color: .comment['color'];
color: #defaults > .something > @hello['color'];
padding: #defaults > non-existant['padding'];
margin: #defaults > .something['non-existant'];
}
.mix {
#defaults;
font-size: .something[@space];
}

View file

@ -0,0 +1,77 @@
// simple arity
.hello(@a) {
hello: one;
}
.hello(@a, @b) {
hello: two;
}
.hello(@a, @b, @c) {
hello: three;
}
.world(@a, @b, @c) {
world: three;
}
.world(@a, @b) {
world: two;
}
.world(@a) {
world: one;
}
.one {
.hello(1);
.world(1);
}
.two {
.hello(1, 1);
.world(1, 1);
}
.three {
.hello(1, 1, 1);
.world(1, 1, 1);
}
// arity with default values
.foo(@a, @b: cool) {
foo: two @b;
}
.foo(@a, @b: cool, @c: yeah) {
foo: three @b @c;
}
.baz(@a, @b, @c: yeah) {
baz: three @c;
}
.baz(@a, @b: cool) {
baz: two @b;
}
.multi-foo {
.foo(1);
.foo(1, 1);
.foo(1,1,1);
}
.multi-baz {
.baz(1);
.baz(1, 1);
.baz(1,1,1);
}

View file

@ -0,0 +1,41 @@
* { color: blue; }
E { color: blue; }
E[foo] { color: blue; }
[foo] { color: blue; }
[foo] .helloWorld { color: blue; }
[foo].helloWorld { color: blue; }
E[foo="barbar"] { color: blue; }
E[foo~="hello#$@%@$#^"] { color: blue; }
E[foo^="color: green;"] { color: blue; }
E[foo$="239023"] { color: blue; }
E[foo*="29302"] { color: blue; }
E[foo|="239032"] { color: blue; }
E:root { color: blue; }
E:nth-child(odd) { color: blue; }
E:nth-child(2n+1) { color: blue; }
E:nth-child(5) { color: blue; }
E:nth-last-child(-n+2) { color: blue; }
E:nth-of-type(2n) { color: blue; }
E:nth-last-of-type(n) { color: blue; }
E:first-child { color: blue; }
E:last-child { color: blue; }
E:first-of-type { color: blue; }
E:last-of-type { color: blue; }
E:only-child { color: blue; }
E:only-of-type { color: blue; }
E:empty { color: blue; }
E:lang(en) { color: blue; }
E::first-line { color: blue; }
E::before { color: blue; }
E#id { color: blue; }
E:not(:link) { color: blue; }
E F { color: blue; }
E > F { color: blue; }
E + F { color: blue; }
E ~ F { color: blue; }

View file

@ -0,0 +1,96 @@
// builtin
@something: "hello world";
@color: #112233;
@color2: rgba(44,55,66, .6);
body {
color: @something;
@num: 7 / 6;
num-basic: @num + 4;
num-floor: floor(@num) + 4px;
num-ceil: ceil(@num) + 4px;
@num2: 2 / 3;
num2: @num2;
num2-round: round(@num2);
num2-floor: floor(@num2);
num2-ceil: ceil(@num2);
round-lit: round(10px / 3);
rgba1: rgbahex(@color);
rgba2: rgbahex(@color2);
argb: argb(@color2);
}
format {
@r: 32;
format: %("rgb(%d, %d, %d)", @r, 128, 64);
format-string: %("hello %s", "world");
format-multiple: %("hello %s %d", "earth", 2);
format-url-encode: %('red is %A', #ff0000);
eformat: e(%("rgb(%d, %d, %d)", @r, 128, 64));
}
#functions {
str1: isstring("hello");
str2: isstring(one, two);
num1: isnumber(2323px);
num2: isnumber(2323);
num3: isnumber(4/5);
num4: isnumber("hello");
col1: iscolor(red);
col2: iscolor(hello);
col3: iscolor(rgba(0,0,0,0.3));
col4: iscolor(#fff);
key1: iskeyword(hello);
key2: iskeyword(3D);
px1: ispixel(10px);
px2: ispixel(10);
per1: ispercentage(10%);
per2: ispercentage(10);
em1: isem(10em);
em2: isem(10);
ex1: extract(1 2 3 4, 2);
ex2: extract(1 2, 1);
ex3: extract(1, 1);
@list: 1,2,3,4;
ex4: extract(@list, 2);
pow: pow(2,4);
pi: pi();
mod: mod(14,10);
tan: tan(1);
cos: cos(1);
sin: sin(1);
atan: atan(1);
acos: acos(1);
asin: asin(1);
sqrt: sqrt(8);
}
#unit {
@unit: "em";
unit-lit: unit(10px);
unit-arg: unit(10px, "s");
unit-arg2: unit(10px, @unit);
unit-math: unit(0.07407s) * 100%;
}

View file

@ -0,0 +1,154 @@
body {
color:rgb(red(#f00), red(#0F0), red(#00f));
color:rgb(red(#f00), green(#0F0), blue(#00f));
color:rgb(red(#0ff), green(#f0f), blue(#ff0));
color: hsl(34, 50%, 40%);
color: hsla(34, 50%, 40%, 0.3);
lighten1: lighten(#efefef, 10%);
lighten2: lighten(rgb(23, 53, 231), 22%);
lighten3: lighten(rgba(212, 103, 88, 0.5), 10%);
darken1: darken(#efefef, 10%);
darken2: darken(rgb(23, 53, 231), 22%);
darken3: darken(rgba(23, 53, 231, 0.5), 10%);
saturate1: saturate(#efefef, 10%);
saturate2: saturate(rgb(23, 53, 231), 22%);
saturate3: saturate(rgba(23, 53, 231, 0.5), 10%);
desaturate1: desaturate(#efefef, 10%);
desaturate2: desaturate(rgb(23, 53, 231), 22%);
desaturate3: desaturate(rgba(23, 53, 231, 0.5), 10%);
spin1: spin(#efefef, 12);
spin2: spin(rgb(23, 53, 231), 15);
spin3: spin(rgba(23, 53, 231, 0.5), 19);
spin2: spin(#efefef, -12);
spin3: spin(rgb(23, 53, 231), -15);
spin4: spin(rgba(23, 53, 231, 0.5), -19);
one1: fadein(#abcdef, 10%);
one2: fadeout(#abcdef, -10%);
two1: fadeout(#029f23, 10%);
two2: fadein(#029f23, -10%);
three1: fadein(rgba(1,2,3, 0.5), 10%);
three2: fadeout(rgba(1,2,3, 0.5), -10%);
four1: fadeout(rgba(1,2,3, 0), 10%);
four2: fadein(rgba(1,2,3, 0), -10%);
hue: hue(rgb(34,20,40));
sat: saturation(rgb(34,20,40));
lit: lightness(rgb(34,20,40));
@old: #34fa03;
@new: hsl(hue(@old), 45%, 90%);
what: @new;
zero1: saturate(#123456, -100%);
zero2: saturate(#123456, 100%);
zero3: saturate(#000000, 100%);
zero4: saturate(#ffffff, 100%);
zero5: lighten(#123456, -100%);
zero6: lighten(#123456, 100%);
zero7: lighten(#000000, 100%);
zero8: lighten(#ffffff, 100%);
zero9: spin(#123456, -100);
zeroa: spin(#123456, 100);
zerob: spin(#000000, 100);
zeroc: spin(#ffffff, 100);
}
alpha {
// g: alpha(red);
g1: alpha(rgba(0,0,0,0));
g2: alpha(rgb(155,55,0));
}
fade {
f1: fade(red, 50%);
f2: fade(#fff, 20%);
f3: fade(rgba(34,23,64,0.4), 50%);
}
@a: rgb(255,255,255);
@b: rgb(0,0,0);
.mix {
color1: mix(@a, @b, 50%);
color2: mix(@a, @b);
color3: mix(rgba(5,3,1,0.3), rgba(6,3,2, 0.8), 50%);
}
.contrast {
color1: contrast(#000, red, blue);
color2: contrast(#fff, red, blue);
}
.percent {
per: percentage(0.5);
}
// color keywords
.colorz {
color1: whitesmoke - 10;
color2: spin(red, 34);
color3: spin(blah);
}
// purposfuly whacky to match less.js
@color: #fcf8e3;
body {
start: @color;
spin: spin(@color, -10); // #fcf4e3
chained: darken(spin(@color, -10), 3%); // gives #fbeed5, should be #fbefd5
direct: darken(#fcf4e3, 3%); // #fbefd5
}
// spin around
pre {
@errorBackground: #f2dede;
spin: spin(@errorBackground, -10);
}
dd {
@white: #fff;
background-color: mix(@white, darken(@white, 10%), 60%);
}
// math
.ops {
c1: red * 0.3;
c2: green / 2;
c3: purple % 7;
c4: 4 * salmon;
c5: 1 + salmon;
c6: 132 / red;
c7: 132 - red;
c8: 132- red;
}
.transparent {
r: red(transparent);
g: green(transparent);
b: blue(transparent);
a: alpha(transparent);
}

View file

@ -0,0 +1,39 @@
@mixin {
height: 22px;
ul {
height: 20px;
li {
@color: red;
height: 10px;
div span, link {
margin: 10px;
color: @color;
}
}
div, p {
border: 1px;
&.hello {
color: green;
}
:what {
color: blue;
}
}
a {
b {
color: blue;
}
}
}
}
body {
@mixin;
}

View file

@ -0,0 +1,7 @@
.small {
background: data-uri("../hi.less");
}
.large {
background: data-uri('../../../lessc.inc.php');
}

View file

@ -0,0 +1,28 @@
@hello: "utf-8";
@charset @hello;
@-moz-document url-prefix(){
div {
color: red;
}
}
@page :left { margin-left: 4cm; }
@page :right { margin-left: 3cm; }
@page { margin: 2cm }
@-ms-viewport {
width: device-width;
}
@-moz-viewport {
width: device-width;
}
@-o-viewport {
width: device-width;
}
@viewport {
width: device-width;
}

View file

@ -0,0 +1,18 @@
body {
@hello: "world";
e1: e("this is simple");
e2: e("this is simple", "cool lad");
e3: e(1232);
e4: e(@hello);
e5: e("one" + 'more');
t1: ~"eating rice";
t2: ~"string cheese";
t3: a b c ~"string me" d e f;
t4: ~"string @{hello}";
}
.class {
filter: ~"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png')";
}

View file

@ -0,0 +1,28 @@
@font-directory: 'fonts/';
@some-family: Gentium;
@font-face: maroon; // won't collide with @font-face { }
@font-face {
font-family: Graublau Sans Web;
src: url(@{font-directory}GraublauWeb.otf) format("opentype");
}
@font-face {
font-family: @some-family;
src: url('@{font-directory}Gentium.ttf');
}
@font-face {
font-family: @some-family;
src: url("@{font-directory}GentiumItalic.ttf");
font-style: italic;
}
h2 {
font-family: @some-family;
crazy: @font-face;
}

View file

@ -0,0 +1,74 @@
.simple(@hi) when (@hi) {
simple: yellow;
}
.something(@hi) when (@hi = cool) {
something: red;
}
.another(@x) when (@x > 10) {
another: green;
}
.flipped(@x) when (@x =< 10) {
flipped: teal;
}
.yeah(@arg) when (isnumber(@arg)) {
yeah-number: purple @arg;
}
.yeah(@arg) when (ispixel(@arg)) {
yeah-pixel: silver;
}
.hello(@arg) when not (@arg) {
hello: orange;
}
dd {
.simple(true);
}
b {
.something(cool);
.something(birthday);
}
img {
.another(12);
.flipped(2);
}
body {
.yeah(232px);
.yeah(232);
}
.something(@x) when (@x) and (@y), not (@x = what) {
something-complex: blue @x;
}
div {
@y: true;
.something(true);
}
.coloras(@g) when (iscolor(@g)) {
color: true @g;
}
link {
.coloras(red);
.coloras(#fff);
.coloras(#fffddd);
.coloras(rgb(0,0,0));
.coloras(rgba(0,0,0, .34));
}

View file

@ -0,0 +1,6 @@
// css hacks
:root .alert-message, :root .btn {
border-radius: 0 \0;
}

View file

@ -0,0 +1,5 @@
div:before {
content: "hi!";
}

View file

@ -0,0 +1,12 @@
foo {
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr=#c0ff3300, endColorstr=#ff000000);
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr=#c0ff3300, endColorstr=#ff000001);
}
foo {
filter: alpha(opacity=20);
filter: alpha(opacity=20, enabled=true);
filter: blaznicate(foo=bar, baz=bang bip, bart=#fa4600);
}

View file

@ -0,0 +1,56 @@
@import 'file1.less'; // file found and imported
@import "not-found";
@import "something.css" media;
@import url("something.css") media;
@import url(something.css) media, screen, print;
@color: maroon;
@import url(file2); // found and imported
body {
line-height: 10em;
@colors;
}
div {
@color: fuchsia;
@import "file2";
}
.mixin-import() {
@import "file3";
}
.one {
.mixin-import();
color: blue;
}
.two {
.mixin-import();
}
#merge-import-mixins {
@import "a";
@import "b";
div { .just-a-class; }
}
@import "inner/file1";
// test bubbling variables up from imports, while preserving order
pre {
color: @someValue;
}
@import "file3";

View file

@ -0,0 +1,47 @@
@cool-hello: "yes";
@cool-yes: "okay";
@var: "hello";
div {
interp1: ~"@{cool-hello}";
interp2: ~"@{cool-@{var}}";
interp3: ~"@{cool-@{cool-@{var}}}";
}
// interpolation in selectors
@hello: 10;
@world: "yeah";
@{hello}@{world} {
color: blue;
}
@{hello} {
color: blue;
}
hello world @{hello} {
color: red;
}
#@{world} {
color: "hello @{hello}";
}
@num: 3;
[prop],
[prop="value@{num}"],
[prop*="val@{num}"],
[|prop~="val@{num}"],
[*|prop$="val@{num}"],
[ns|prop^="val@{num}"],
[@{num}^="val@{num}"],
[@{num}=@{num}],
[@{num}] {
attributes: yes;
}

View file

@ -0,0 +1,52 @@
@keyframes 'bounce' {
from {
top: 100px;
animation-timing-function: ease-out;
}
25% {
top: 50px;
animation-timing-function: ease-in;
}
50% {
top: 100px;
animation-timing-function: ease-out;
}
75% {
top: 75px;
animation-timing-function: ease-in;
}
to {
top: 100px;
}
}
@-webkit-keyframes flowouttoleft {
0% { -webkit-transform: translateX(0) scale(1); }
60%, 70% { -webkit-transform: translateX(0) scale(.7); }
100% { -webkit-transform: translateX(-100%) scale(.7); }
}
div {
animation-name: 'diagonal-slide';
animation-duration: 5s;
animation-iteration-count: 10;
}
@keyframes 'diagonal-slide' {
from {
left: 0;
top: 0;
}
to {
left: 100px;
top: 100px;
}
}

View file

@ -0,0 +1,122 @@
.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;
}

View file

@ -0,0 +1,68 @@
@media screen, 3D {
P { color: green; }
}
@media print {
body { font-size: 10pt }
}
@media screen {
body { font-size: 13px }
}
@media screen, print {
body { line-height: 1.2 }
}
@media all and (min-width: 0px) {
body { line-height: 1.2 }
}
@media all and (min-width: 0) {
body { line-height: 1.2 }
}
@media
screen and (min-width: 102.5em) and (max-width: 117.9375em),
screen and (min-width: 150em) {
body { color: blue }
}
@media screen and (min-height: 100px + 10px) {
body { color: red; }
}
@cool: 100px;
@media screen and (height: @cool) and (width: @cool + 10), (size: @cool + 20) {
body { color: red; }
}
// media bubbling
@media test {
div {
height: 20px;
@media (hello) {
color: red;
pre {
color: orange;
}
}
}
}
// should not cross boundary
@media yeah {
@page {
@media cool {
color: red;
}
}
}
// variable in query
@mobile: ~"(max-width: 599px)";
@media @mobile {
.helloworld { color: blue }
}

View file

@ -0,0 +1,100 @@
@color: #fff;
@base_path: "/assets/images/";
@images: @base_path + "test/";
.topbar { background: url(@{images}topbar.png); }
.hello { test: empty-function(@images, 40%, to(@color)); }
.css3 {
background-image: -webkit-gradient(linear, 0% 0%, 0% 90%,
from(#E9A000), to(#A37000));
}
/**
Here is a block comment
**/
// this is a comment
.test, /*hello*/.world {
border: 1px solid red; // world
/* another property */
color: url(http://mage-page.com);
string: "hello /* this is not a comment */";
world: "// neither is this";
string: 'hello /* this is not a comment */' /*what if this is a comment */;
world: '// neither is this' // hell world;
;
what-/*something?*/ever: 100px;
background: url(/*no comment here*/);
}
.urls {
@var: "http://google.com";
background1: url(@var);
background2: url(@{var});
background3: url("@{var}");
}
.mix(@arg) { color: @arg; }
@aaa: aaa;
@bbb: bbb;
// make sure the opening selector isn't too greedy
.cool {.mix("@{aaa}, @{bbb}")}
.cool();
// merging of mixins
.span-17 { float: left; }
.span-17 { width: 660px; }
.x {.span-17;}
.hi {
pre {
color: red;
}
}
.hi {
pre {
color: blue;
}
}
.rad {
.hi;
}
hello {
numbers: 1.0 0.1 .1 1.;
numbers: 1.0s 0.1s .1s 1.s;
numbers: -1.0s -0.1s -.1s -1.s;
numbers: -1.0 -0.1 -.1 -1.;
}
#string {
hello: 'what\'s going on here';
hello: 'blah blag @{ blah blah';
join: 3434 + "hello";
join: 3434 + hello;
}
.duplicates {
hello: world;
hello: "world";
hello: world;
hello: "what";
hello: world;
hello: "world";
}

View file

@ -0,0 +1,33 @@
@outer: 10px;
@class(@var:22px, @car: 400px + @outer) {
margin: @var;
height: @car;
}
@group {
@f(@color) {
color: @color;
}
.cool {
border-bottom: 1px solid green;
}
}
.class(@width:200px) {
padding: @width;
}
body {
.class(2.0em);
@group > @f(red);
@class(10px, 10px + 2);
@group > .cool;
}
@lots(@a: 10px, @b: 20px, @c: 30px, @d: 40px, @e: 4px, @f:3px, @g:2px, @h: 1px) {
padding: @a @b @c @d;
margin: @e @f @g @h;
}

View file

@ -0,0 +1,100 @@
@tester {
p, div { height: 10px; }
}
#test1 {
div { color: red; }
@tester;
}
@cool {
a,b,i { width: 1px; }
}
#test2 {
b { color: red; }
@cool;
}
#test3 {
@cool;
b { color: red; }
}
@cooler {
a { margin: 1px; }
}
#test4 {
a, div, html { color: blue; }
@cooler;
}
@hi {
img, strong { float: right; }
}
#test5 {
img, strong { padding: 2px; }
@hi;
}
@nested {
div, span {
a {
color: red;
}
}
}
#test6 {
div, span {
a {
line-height: 10px;
}
}
@nested;
}
@broken-nesting {
div, span {
strong, b {
color: red;
}
}
}
#test7 {
div {
strong {
margin: 1px;
}
}
@broken-nesting;
}
@another-nest {
a,b {
i {
color: red;
}
s {
color: blue;
}
}
}
#test8 {
a, b {
i,s {
background: red;
}
}
@another-nest;
}

View file

@ -0,0 +1,197 @@
@rounded-corners {
border-radius: 10px;
}
.bold {
@font-size: 20px;
font-size: @font-size;
font-weight: bold;
}
body #window {
@rounded-corners;
.bold;
line-height: @font-size * 1.5;
}
#bundle {
.button {
display: block;
border: 1px solid black;
background-color: grey;
&:hover { background-color: white }
}
}
#header a {
color: orange;
#bundle > .button; // mixin the button class
}
div {
@abstract {
hello: world;
b {
color: blue;
}
}
@abstract > b;
@abstract;
}
@poop {
big: baby;
}
body {
div;
}
// not using > to list mixins
.hello {
.world {
color: blue;
}
}
.foobar {
.hello .world;
}
// arguments
.spam(@something: 100, @dad: land) {
@wow: 23434;
foo: @arguments;
bar: @arguments;
}
.eggs {
.spam(1px, 2px);
.spam();
}
.first(@one, @two, @three, @four: cool) {
cool: @arguments;
}
#hello {
.first(one, two, three);
}
#hello-important {
.first(one, two, three) !important;
}
.rad(@name) {
cool: @arguments;
}
#world {
@hello: "world";
.rad("@{hello}");
}
.second(@x, @y:skip, @z: me) {
things: @arguments;
}
#another {
.second(red, blue, green);
.second(red blue green);
}
.another(@x, @y:skip, @z:me) {
.cool {
color: @arguments;
}
}
#day {
.another(one,two, three);
.another(one two three);
}
.to-be-important() {
color: red;
@color: red;
height: 20px;
pre {
color: @color;
}
}
.mix-suffix {
.to-be-important() !important;
}
#search-all {
.red() {
color:#f00 !important;
}
}
#search-all {
.green() {
color: #0f0 !important;
}
}
.search-test {
#search-all > .red();
#search-all > .green();
}
// mixin self without infinite loop
.cowboy() {
color: blue;
}
.cowboy {
.cowboy;
}
// semicolon
.semi1(@color: red, blue, green;) {
color: @color;
}
.semi2(@color: red, blue, green; dad) {
color: @color;
}
.semi3(hello; world; piss) {
hello: world;
}
// self referencing skipping
.nav-divider(@color: red){
padding: 10px;
}
.nav {
.nav-divider {
.nav-divider();
}
}
.nav-divider {
.nav-divider();
}

View file

@ -0,0 +1,60 @@
#header {
color: black;
.navigation {
font-size: 12px;
.border {
.outside {
color: blue;
}
}
}
.logo {
width: 300px;
&:hover { text-decoration: none }
}
}
a { b { ul { li { color: green; } } } }
this { will { not { show { } } } }
.cool {
div & { color: green; }
p & span { color: yellow; }
}
another {
.cool;
}
b {
& .something {
color: blue;
}
&.something {
color: blue;
}
}
.foo {
.bar, .baz {
& .qux {
display: block;
}
.qux & {
display: inline;
}
.qux & .biz {
display: none;
}
}
}
b {
hello [x="&yeah"] {
color: red;
}
}

View file

@ -0,0 +1,157 @@
.demo (light, @color) {
color: lighten(@color, 10%);
}
.demo (@_, @color) {
display: block;
}
@switch: light;
.class {
.demo(@switch, #888);
}
// by arity
.mixin () {
zero: 0;
}
.mixin (@a: 1px) {
one: 1;
}
.mixin (@a) {
one-req: 1;
}
.mixin (@a: 1px, @b: 2px) {
two: 2;
}
.mixin (@a, @b, @c) {
three-req: 3;
}
.mixin (@a: 1px, @b: 2px, @c: 3px) {
three: 3;
}
.zero {
.mixin();
}
.one {
.mixin(1);
}
.two {
.mixin(1, 2);
}
.three {
.mixin(1, 2, 3);
}
//
.mixout ('left') {
left: 1;
}
.mixout ('right') {
right: 1;
}
.left {
.mixout('left');
}
.right {
.mixout('right');
}
//
.border (@side, @width) {
color: black;
.border-side(@side, @width);
}
.border-side (left, @w) {
border-left: @w;
}
.border-side (right, @w) {
border-right: @w;
}
.border-right {
.border(right, 4px);
}
.border-left {
.border(left, 4px);
}
//
.border-radius (@r) {
both: @r * 10;
}
.border-radius (@r, left) {
left: @r;
}
.border-radius (@r, right) {
right: @r;
}
.only-right {
.border-radius(33, right);
}
.only-left {
.border-radius(33, left);
}
.left-right {
.border-radius(33);
}
.hola(hello, @hello...) {
color: blue;
}
#hola {
.hola(hello, world);
}
.resty(@hello, @world, @the_rest...) {
padding: @hello @world;
rest: @the_rest;
}
.defaults(@aa, @bb:e343, @cc: "heah", ...) {
height: @aa;
}
#defaults_1 {
.defaults(one);
.defaults(two, one);
.defaults(three, two, one);
.defaults(four, three, two, one);
}
.thing() { color: green; }
.thing(...) { color: blue; }
.thing { color: red; }
#aa {
.thing();
}
#bb {
.thing;
}
#cc {
.thing(1);
}

View file

@ -0,0 +1,40 @@
@a: 10;
@some {
@b: @a + 10;
div {
@c: @b + 10;
other {
@d: @c + 10;
world {
@e: @d + 10;
height: @e;
}
}
}
}
body {
@some;
}
@some;
.test(@x: 10) {
height: @x;
.test(@y: 11) {
height: @y;
.test(@z: 12) {
height: @z;
}
.test;
}
.test;
}
pre {
.test;
}

View file

@ -0,0 +1,29 @@
@color: blue;
something @{color}, world {
color: blue;
}
.div {
@color: red;
(3434) {
height: 100px;
}
cool @{color} {
height: 4000px;
}
}
.heck(@a) { color: @a+10 }
.spanX (@index) when (@index > 0) {
.span@{index} { .heck(@index) }
.spanX(@index - 1);
}
.spanX (0) {}
.spanX (5);

View file

@ -0,0 +1,120 @@
// these are the demos from the lessphp homepage
default {
@base: 24px;
@border-color: #B2B;
.underline { border-bottom: 1px solid green }
#header {
color: black;
border: 1px solid @border-color + #222222;
.navigation {
font-size: @base / 2;
a {
.underline;
}
}
.logo {
width: 300px;
&:hover { text-decoration: none }
}
}
}
variables {
@a: 2;
@x: @a * @a;
@y: @x + 1;
@z: @x * 2 + @y;
@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
@b: @a * 10;
@c: #888;
@fonts: "Trebuchet MS", Verdana, sans-serif;
.variables {
width: @z + 1cm; // 14cm
height: @b + @x + 0px; // 24px
color: @c;
background: @light-blue;
font-family: @fonts;
}
}
mixins {
.bordered {
border-top: dotted 1px black;
border-bottom: solid 2px black;
}
#menu a {
color: #111;
.bordered;
}
.post a {
color: red;
.bordered;
}
}
nested-rules {
#header {
color: black;
.navigation {
font-size: 12px;
}
.logo {
width: 300px;
&:hover { text-decoration: none }
}
}
}
namespaces {
#bundle {
.button {
display: block;
border: 1px solid black;
background-color: grey;
&:hover { background-color: white }
}
}
#header a {
color: orange;
#bundle > .button; // mixin the button class
}
}
mixin-functions {
@outer: 10px;
@class(@var:22px, @car: 400px + @outer) {
margin: @var;
height: @car;
}
@group {
@f(@color) {
color: @color;
}
.cool {
border-bottom: 1px solid green;
}
}
.class(@width:200px) {
padding: @width;
}
body {
.class(2.0em);
@group > @f(red);
@class(10px, 10px + 2);
@group > .cool;
}
}

View file

@ -0,0 +1,6 @@
.just-a-class { background: red; }
.some-mixin() {
height: 200px;
}

View file

@ -0,0 +1,12 @@
.just-a-class { background: blue; }
.hello {
.some-mixin();
}
@media cool {
color: red;
.some-mixin();
}

View file

@ -0,0 +1,16 @@
/**
* This is a test import file
*/
@colors {
div.bright {
color: red;
}
div.sad {
color: blue;
}
}

View file

@ -0,0 +1,6 @@
b {
color: @color;
padding: 16px;
}

View file

@ -0,0 +1,7 @@
h2 {
background: url("../images/logo.png") no-repeat;
}
@someValue: hello-from-file-3;

View file

@ -0,0 +1,6 @@
.inner {
content: "inner/file1.less"
}
@import "file2"; // should get the one in inner

View file

@ -0,0 +1,4 @@
.inner {
content: "inner/file2.less"
}

View file

@ -0,0 +1,44 @@
@a: 2;
@x: @a * @a;
@y: @x + 1;
@z: @y + @x * 2;
@m: @z % @y;
@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
@rgb-color: rgb(20%, 15%, 80%);
@rgba-color: rgba(23,68,149,0.5);
@b: @a * 10px;
@c: #888;
@fonts: "Trebuchet MS", Verdana, sans-serif;
.variables {
width: @z + 1cm; // 14cm
height: @b + @x + 0px; // 24px
margin-top: -@b; // -20px
margin-bottom: 10 - -@b; // 30px
@d: @c + #001;
color: @d;
background: @light-blue;
font-family: @fonts;
margin: @m + 0px; // 3px
font: 10px/12px serif;
font: 120%/120% serif;
}
.external {
color: @c;
border: 1px solid @rgb-color;
background: @rgba-color;
}
@hello: 44px;
@something: "hello";
@cool: something;
outer1: @@something;
outer2: @@@cool;

View file

@ -0,0 +1,205 @@
.mixin (@a: 1px, @b: 50%) {
width: (@a * 5);
height: (@b - 1%);
}
.mixina (@style, @width, @color: black) {
border: @width @style @color;
}
.mixiny
(@a: 0, @b: 0) {
margin: @a;
padding: @b;
}
.hidden() {
color: transparent; // asd
}
#hidden {
.hidden;
}
#hidden1 {
.hidden();
}
.two-args {
color: blue;
.mixin(2px, 100%);
.mixina(dotted, 2px);
}
.one-arg {
.mixin(3px);
}
.no-parens {
.mixin;
}
.no-args {
.mixin();
}
.var-args {
@var: 9;
.mixin(@var, (@var * 2));
}
.multi-mix {
.mixin(2px, 30%);
.mixiny(4, 5);
}
.maxa(@arg1: 10, @arg2: #f00) {
padding: (@arg1 * 2px);
color: @arg2;
}
body {
.maxa(15);
}
@glob: 5;
.global-mixin(@a:2) {
width: (@glob + @a);
}
.scope-mix {
.global-mixin(3);
}
.nested-ruleset (@width: 200px) {
width: @width;
.column { margin: @width; }
}
.content {
.nested-ruleset(600px);
}
//
.same-var-name2(@radius) {
radius: @radius;
}
.same-var-name(@radius) {
.same-var-name2(@radius);
}
#same-var-name {
.same-var-name(5px);
}
//
.var-inside () {
@var: 10px;
width: @var;
}
#var-inside { .var-inside; }
.mixin-arguments (@width: 0px, ...) {
border: @arguments;
width: @width;
}
.arguments {
.mixin-arguments(1px, solid, black);
}
.arguments2 {
.mixin-arguments();
}
.arguments3 {
.mixin-arguments;
}
.mixin-arguments2 (@width, @rest...) {
border: @arguments;
rest: @rest;
width: @width;
}
.arguments4 {
.mixin-arguments2(0, 1, 2, 3, 4);
}
// Edge cases
.edge-case {
.mixin-arguments("{");
}
// Division vs. Literal Slash
.border-radius(@r: 2px/5px) {
border-radius: @r;
}
.slash-vs-math {
.border-radius();
.border-radius(5px/10px);
.border-radius((3px * 2));
}
// semi-colon vs comma for delimiting
.mixin-takes-one(@a) {
one: @a;
}
.mixin-takes-two(@a; @b) {
one: @a;
two: @b;
}
.comma-vs-semi-colon {
.mixin-takes-two(@a : a; @b : b, c);
.mixin-takes-two(@a : d, e; @b : f);
.mixin-takes-one(@a: g);
.mixin-takes-one(@a : h;);
.mixin-takes-one(i);
.mixin-takes-one(j;);
.mixin-takes-two(k, l);
.mixin-takes-one(m, n;);
.mixin-takes-two(o, p; q);
.mixin-takes-two(r, s; t;);
}
.mixin-conflict(@a:defA, @b:defB, @c:defC) {
three: @a, @b, @c;
}
.mixin-conflict(@a:defA, @b:defB, @c:defC, @d:defD) {
four: @a, @b, @c, @d;
}
#named-conflict {
.mixin-conflict(11, 12, 13, @a:a);
.mixin-conflict(@a:a, 21, 22, 23);
}
@a: 3px;
.mixin-default-arg(@a: 1px, @b: @a, @c: @b) {
defaults: 1px 1px 1px;
defaults: 2px 2px 2px;
}
.test-mixin-default-arg {
.mixin-default-arg();
.mixin-default-arg(2px);
}
.mixin-comma-default1(@color; @padding; @margin: 2, 2, 2, 2) {
margin: @margin;
}
.selector {
.mixin-comma-default1(#33acfe; 4);
}
.mixin-comma-default2(@margin: 2, 2, 2, 2;) {
margin: @margin;
}
.selector2 {
.mixin-comma-default2();
}
.mixin-comma-default3(@margin: 2, 2, 2, 2) {
margin: @margin;
}
.selector3 {
.mixin-comma-default3(4,2,2,2);
}

View file

@ -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);
}

View file

@ -0,0 +1,51 @@
#strings {
background-image: url("http://son-of-a-banana.com");
quotes: "~" "~";
content: "#*%:&^,)!.(~*})";
empty: "";
brackets: "{" "}";
escapes: "\"hello\" \\world";
escapes2: "\"llo";
}
#comments {
content: "/* hello */ // not-so-secret";
}
#single-quote {
quotes: "'" "'";
content: '""#!&""';
empty: '';
semi-colon: ';';
}
#escaped {
filter: ~"DX.Transform.MS.BS.filter(opacity=50)";
}
#one-line { image: url(http://tooks.com) }
#crazy { image: url(http://), "}", url("http://}") }
#interpolation {
@var: '/dev';
url: "http://lesscss.org@{var}/image.jpg";
@var2: 256;
url2: "http://lesscss.org/image-@{var2}.jpg";
@var3: #456;
url3: "http://lesscss.org@{var3}";
@var4: hello;
url4: "http://lesscss.org/@{var4}";
@var5: 54.4px;
url5: "http://lesscss.org/@{var5}";
}
// multiple calls with string interpolation
.mix-mul (@a: green) {
color: ~"@{a}";
}
.mix-mul-class {
.mix-mul(blue);
.mix-mul(red);
.mix-mul(black);
.mix-mul(orange);
}

View file

@ -0,0 +1,14 @@
.article { color:#294366; }
.comment {
width:960px;
color:#294366;
padding:10px;
}
.wow {
height:960px;
background-color:#294366;
color:green;
padding:;
margin:;
}
.mix { font-size:10px; }

View file

@ -0,0 +1,25 @@
.one {
hello: one;
world: one;
}
.two {
hello: two;
world: two;
}
.three {
hello: three;
world: three;
}
.multi-foo {
foo: two cool;
foo: three cool yeah;
foo: two 1;
foo: three 1 yeah;
foo: three 1 1;
}
.multi-baz {
baz: two cool;
baz: three yeah;
baz: two 1;
baz: three 1;
}

View file

@ -0,0 +1,105 @@
* {
color: blue;
}
E {
color: blue;
}
E[foo] {
color: blue;
}
[foo] {
color: blue;
}
[foo] .helloWorld {
color: blue;
}
[foo].helloWorld {
color: blue;
}
E[foo="barbar"] {
color: blue;
}
E[foo~="hello#$@%@$#^"] {
color: blue;
}
E[foo^="color: green;"] {
color: blue;
}
E[foo$="239023"] {
color: blue;
}
E[foo*="29302"] {
color: blue;
}
E[foo|="239032"] {
color: blue;
}
E:root {
color: blue;
}
E:nth-child(odd) {
color: blue;
}
E:nth-child(2n+1) {
color: blue;
}
E:nth-child(5) {
color: blue;
}
E:nth-last-child(-n+2) {
color: blue;
}
E:nth-of-type(2n) {
color: blue;
}
E:nth-last-of-type(n) {
color: blue;
}
E:first-child {
color: blue;
}
E:last-child {
color: blue;
}
E:first-of-type {
color: blue;
}
E:last-of-type {
color: blue;
}
E:only-child {
color: blue;
}
E:only-of-type {
color: blue;
}
E:empty {
color: blue;
}
E:lang(en) {
color: blue;
}
E::first-line {
color: blue;
}
E::before {
color: blue;
}
E#id {
color: blue;
}
E:not(:link) {
color: blue;
}
E F {
color: blue;
}
E > F {
color: blue;
}
E + F {
color: blue;
}
E ~ F {
color: blue;
}

View file

@ -0,0 +1,61 @@
body {
color: "hello world";
num-basic: 5.1666666666667;
num-floor: 5px;
num-ceil: 6px;
num2: 0.66666666666667;
num2-round: 1;
num2-floor: 0;
num2-ceil: 1;
round-lit: 3px;
rgba1: #ff112233;
rgba2: #992c3742;
argb: #992c3742;
}
format {
format: "rgb(32, 128, 64)";
format-string: "hello world";
format-multiple: "hello earth 2";
format-url-encode: 'red is %A';
eformat: rgb(32, 128, 64);
}
#functions {
str1: true;
str2: false;
num1: true;
num2: true;
num3: true;
num4: false;
col1: true;
col2: false;
col3: true;
col4: true;
key1: true;
key2: false;
px1: true;
px2: false;
per1: true;
per2: false;
em1: true;
em2: false;
ex1: 2;
ex2: 1;
ex3: extract(1,1);
ex4: 2;
pow: 16;
pi: 3.1415926535898;
mod: 4;
tan: 1.5574077246549;
cos: 0.54030230586814;
sin: 0.8414709848079;
atan: 0.78539816339745rad;
acos: 0rad;
asin: 1.5707963267949rad;
sqrt: 2.8284271247462;
}
#unit {
unit-lit: 10;
unit-arg: 10s;
unit-arg2: 10em;
unit-math: 7.407%;
}

View file

@ -0,0 +1,103 @@
body {
color: #ff0000;
color: #ffffff;
color: #000000;
color: #996d33;
color: rgba(153,109,51,0.3);
lighten1: #ffffff;
lighten2: #7c8df2;
lighten3: rgba(222,140,129,0.5);
darken1: #d6d6d6;
darken2: #0d1e81;
darken3: rgba(18,42,185,0.5);
saturate1: #f1eded;
saturate2: #0025fe;
saturate3: rgba(10,44,244,0.5);
desaturate1: #efefef;
desaturate2: #3349cb;
desaturate3: rgba(36,62,218,0.5);
spin1: #efefef;
spin2: #2d17e7;
spin3: rgba(59,23,231,0.5);
spin2: #efefef;
spin3: #1769e7;
spin4: rgba(23,119,231,0.5);
one1: #abcdef;
one2: #abcdef;
two1: rgba(2,159,35,0.9);
two2: rgba(2,159,35,0.9);
three1: rgba(1,2,3,0.6);
three2: rgba(1,2,3,0.6);
four1: rgba(1,2,3,0);
four2: rgba(1,2,3,0);
hue: 282;
sat: 33;
lit: 12;
what: #dff1da;
zero1: #343434;
zero2: #003468;
zero3: #000000;
zero4: #ffffff;
zero5: #000000;
zero6: #ffffff;
zero7: #ffffff;
zero8: #ffffff;
zero9: #1d5612;
zeroa: #56124b;
zerob: #000000;
zeroc: #ffffff;
}
alpha {
g1: 0;
g2: 1;
}
fade {
f1: rgba(255,0,0,0.5);
f2: rgba(255,255,255,0.2);
f3: rgba(34,23,64,0.5);
}
.mix {
color1: #808080;
color2: #808080;
color3: rgba(6,3,2,-0.25);
}
.contrast {
color1: #ff0000;
color2: #0000ff;
}
.percent {
per: 50%;
}
.colorz {
color1: #ebebeb;
color2: #ff9100;
color3: #000000;
}
body {
start: #fcf8e3;
spin: #fcf4e3;
chained: #fbeed5;
direct: #fbefd5;
}
pre {
spin: #f2dee1;
}
dd {
background-color: #f5f5f5;
}
.ops {
c1: #4d0000;
c2: #004000;
c3: #020002;
c4: #ffffff;
c5: #fb8173;
c6: 132 / #ff0000;
c7: 132 - #ff0000;
c8: 132- #ff0000;
}
.transparent {
r: 0;
g: 0;
b: 0;
a: 0;
}

View file

@ -0,0 +1,29 @@
body {
height: 22px;
}
body ul {
height: 20px;
}
body ul li {
height: 10px;
}
body ul li div span,
body ul li link {
margin: 10px;
color: red;
}
body ul div,
body ul p {
border: 1px;
}
body ul div.hello,
body ul p.hello {
color: green;
}
body ul div :what,
body ul p :what {
color: blue;
}
body ul a b {
color: blue;
}

View file

@ -0,0 +1,6 @@
.small {
background: url("data:text/plain;base64,CmRpdjpiZWZvcmUgewoJY29udGVudDogImhpISI7Cn0KCg==");
}
.large {
background: url("../../../lessc.inc.php");
}

View file

@ -0,0 +1,27 @@
@charset "utf-8";
@-moz-document url-prefix() {
div {
color: red;
}
}
@page :left {
margin-left: 4cm;
}
@page :right {
margin-left: 3cm;
}
@page {
margin: 2cm;
}
@-ms-viewport {
width: device-width;
}
@-moz-viewport {
width: device-width;
}
@-o-viewport {
width: device-width;
}
@viewport {
width: device-width;
}

View file

@ -0,0 +1,14 @@
body {
e1: this is simple;
e2: this is simple;
e3: 1232;
e4: world;
e5: onemore;
t1: eating rice;
t2: string cheese;
t3: a b c string me d e f;
t4: string world;
}
.class {
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png');
}

View file

@ -0,0 +1,17 @@
@font-face {
font-family: Graublau Sans Web;
src: url(fonts/GraublauWeb.otf) format("opentype");
}
@font-face {
font-family: Gentium;
src: url('fonts/Gentium.ttf');
}
@font-face {
font-family: Gentium;
src: url("fonts/GentiumItalic.ttf");
font-style: italic;
}
h2 {
font-family: Gentium;
crazy: maroon;
}

View file

@ -0,0 +1,27 @@
dd {
simple: yellow;
}
b {
something: red;
something-complex: blue cool;
something-complex: blue birthday;
}
img {
another: green;
flipped: teal;
}
body {
yeah-number: purple 232px;
yeah-pixel: silver;
yeah-number: purple 232;
}
div {
something-complex: blue true;
}
link {
color: true red;
color: true #fff;
color: true #fffddd;
color: true #000000;
color: true rgba(0,0,0,0.34);
}

View file

@ -0,0 +1,4 @@
:root .alert-message,
:root .btn {
border-radius: 0 \0;
}

View file

@ -0,0 +1,3 @@
div:before {
content: "hi!";
}

View file

@ -0,0 +1,9 @@
foo {
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#c0ff3300,endColorstr=#ff000000);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr=#c0ff3300,endColorstr=#ff000001);
}
foo {
filter: alpha(opacity=20);
filter: alpha(opacity=20,enabled=true);
filter: blaznicate(foo=bar,baz=bang bip,bart=#fa4600);
}

View file

@ -0,0 +1,51 @@
@import "not-found";
@import "something.css" media;
@import url("something.css") media;
@import url(something.css) media, screen, print;
b {
color: maroon;
padding: 16px;
}
body {
line-height: 10em;
}
body div.bright {
color: red;
}
body div.sad {
color: blue;
}
.one {
color: blue;
}
#merge-import-mixins .just-a-class {
background: red;
}
#merge-import-mixins .just-a-class {
background: blue;
}
#merge-import-mixins .hello {
height: 200px;
}
@media cool {
#merge-import-mixins {
color: red;
height: 200px;
}
}
#merge-import-mixins div {
background: red;
background: blue;
}
.inner {
content: "inner/file1.less";
}
.inner {
content: "inner/file2.less";
}
pre {
color: hello-from-file-3;
}
h2 {
background: url("../images/logo.png") no-repeat;
}

View file

@ -0,0 +1,28 @@
div {
interp1: yes;
interp2: yes;
interp3: okay;
}
10"yeah" {
color: blue;
}
10 {
color: blue;
}
hello world 10 {
color: red;
}
#"yeah" {
color: "hello 10";
}
[prop],
[prop="value3"],
[prop*="val3"],
[|prop~="val3"],
[*|prop$="val3"],
[ns|prop^="val3"],
[3^="val3"],
[3=3],
[3] {
attributes: yes;
}

View file

@ -0,0 +1,48 @@
@keyframes 'bounce' {
from {
top: 100px;
animation-timing-function: ease-out;
}
25% {
top: 50px;
animation-timing-function: ease-in;
}
50% {
top: 100px;
animation-timing-function: ease-out;
}
75% {
top: 75px;
animation-timing-function: ease-in;
}
to {
top: 100px;
}
}
@-webkit-keyframes flowouttoleft {
0% {
-webkit-transform: translateX(0) scale(1);
}
60%,
70% {
-webkit-transform: translateX(0) scale(.7);
}
100% {
-webkit-transform: translateX(-100%) scale(.7);
}
}
div {
animation-name: 'diagonal-slide';
animation-duration: 5s;
animation-iteration-count: 10;
}
@keyframes 'diagonal-slide' {
from {
left: 0;
top: 0;
}
to {
left: 100px;
top: 100px;
}
}

View file

@ -0,0 +1,69 @@
.unary {
sub: 10 -5;
}
.spaces {
sub1: 5;
sub2: 5;
add1: 15;
add2: 15;
div: 2;
mul1: 50;
mul2: 50;
}
.supress-division {
border-radius: 10px/10px;
border-radius: 10px/12px;
border-radius: hello(10px/10px) world;
font: 10px/30 sans-serif;
font: 10px/20px sans-serif;
font: 10px/22px sans-serif;
border-radius: 0 15px 15px 15px/0 50% 50% 50%;
}
.parens {
sub: 5;
add: 15;
div1: 2;
div2: 2;
mul: 50;
}
.keyword-names {
height: "hello" 25;
}
.negation {
neg1: -1px;
neg2: -1px;
neg3: -10;
}
.test {
single1: 5;
single2: 10;
single3: 10;
parens: 10 -2;
math1: 20;
math2: 20;
complex1: 71;
complex2: 6;
complex3: 6px 1em 2px 2;
var1: 8 4 4 4px;
var2: 96;
var3: 12;
complex4: 113;
}
.percents {
p1: 1000%;
p2: 1000%;
p3: 100%;
p4: 1000px;
p5: 1000%;
p6: 30%;
p7: 10%;
p8: 2%;
}
.misc {
x: 40px;
y: 40em;
}
.cond {
c1: false;
c2: true;
}

View file

@ -0,0 +1,70 @@
@media screen,3D {
P {
color: green;
}
}
@media print {
body {
font-size: 10pt;
}
}
@media screen {
body {
font-size: 13px;
}
}
@media screen,print {
body {
line-height: 1.2;
}
}
@media all and (min-width: 0px) {
body {
line-height: 1.2;
}
}
@media all and (min-width: 0) {
body {
line-height: 1.2;
}
}
@media screen and (min-width: 102.5em) and (max-width: 117.9375em),screen and (min-width: 150em) {
body {
color: blue;
}
}
@media screen and (min-height: 110px) {
body {
color: red;
}
}
@media screen and (height: 100px) and (width: 110px),(size: 120px) {
body {
color: red;
}
}
@media test {
div {
height: 20px;
}
}
@media test and (hello) {
div {
color: red;
}
div pre {
color: orange;
}
}
@media yeah {
@page {
@media cool {
color: red;
}
}
}
@media (max-width: 599px) {
.helloworld {
color: blue;
}
}

View file

@ -0,0 +1,68 @@
color: "aaa, bbb";
.topbar {
background: url(/assets/images/test/topbar.png);
}
.hello {
test: empty-function("/assets/images/test/",40%,to(#fff));
}
.css3 {
background-image: -webkit-gradient(linear,0% 0%,0% 90%,from(#E9A000),to(#A37000));
}
.test,
.world {
border: 1px solid red;
color: url(http://mage-page.com);
string: "hello /* this is not a comment */";
world: "// neither is this";
string: 'hello /* this is not a comment */';
world: '// neither is this';
what-ever: 100px;
background: url(/*no comment here*/);
}
.urls {
background1: url("http://google.com");
background2: url(http://google.com);
background3: url("http://google.com");
}
.cool {
color: "aaa, bbb";
}
.span-17 {
float: left;
}
.span-17 {
width: 660px;
}
.x {
float: left;
width: 660px;
}
.hi pre {
color: red;
}
.hi pre {
color: blue;
}
.rad pre {
color: red;
}
.rad pre {
color: blue;
}
hello {
numbers: 1.0 0.1 .1 1.;
numbers: 1.0s 0.1s .1s 1.s;
numbers: -1s -0.1s -0.1s -1s;
numbers: -1 -0.1 -0.1 -1;
}
#string {
hello: 'what\'s going on here';
hello: 'blah blag @{ blah blah';
join: "3434hello";
join: 3434hello;
}
.duplicates {
hello: world;
hello: "world";
hello: "what";
}

View file

@ -0,0 +1,7 @@
body {
padding: 2.0em;
color: red;
margin: 10px;
height: 12px;
border-bottom: 1px solid green;
}

View file

@ -0,0 +1,42 @@
#test1 div {
color:red;
height:10px;
}
#test1 p { height:10px; }
#test2 b {
color:red;
width:1px;
}
#test2 a, #test2 i { width:1px; }
#test3 a, #test3 i { width:1px; }
#test3 b {
width:1px;
color:red;
}
#test4 a {
color:blue;
margin:1px;
}
#test4 div, #test4 html { color:blue; }
#test5 img, #test5 strong {
padding:2px;
float:right;
}
#test6 div a, #test6 span a {
line-height:10px;
color:red;
}
#test7 div strong {
margin:1px;
color:red;
}
#test7 div b { color:red; }
#test7 span strong, #test7 span b { color:red; }
#test8 a i, #test8 b i {
background:red;
color:red;
}
#test8 a s, #test8 b s {
background:red;
color:blue;
}

View file

@ -0,0 +1,92 @@
.bold {
font-size: 20px;
font-weight: bold;
}
body #window {
border-radius: 10px;
font-size: 20px;
font-weight: bold;
line-height: 30px;
}
#bundle .button {
display: block;
border: 1px solid black;
background-color: grey;
}
#bundle .button:hover {
background-color: white;
}
#header a {
color: orange;
display: block;
border: 1px solid black;
background-color: grey;
}
#header a:hover {
background-color: white;
}
div {
color: blue;
hello: world;
}
div b {
color: blue;
}
body {
color: blue;
hello: world;
}
body b {
color: blue;
}
.hello .world {
color: blue;
}
.foobar {
color: blue;
}
.eggs {
foo: 1px 2px;
bar: 1px 2px;
foo: 100 land;
bar: 100 land;
}
#hello {
cool: one two three cool;
}
#hello-important {
cool: one two three cool !important;
}
#world {
cool: "world";
}
#another {
things: red blue green;
things: red blue green skip me;
}
#day .cool {
color: one two three;
}
#day .cool {
color: one two three skip me;
}
.mix-suffix {
color: red !important;
height: 20px !important;
}
.mix-suffix pre {
color: red;
}
.search-test {
color: #f00 !important;
color: #0f0 !important;
}
.cowboy {
color: blue;
}
.nav .nav-divider {
padding: 10px;
}
.nav-divider {
padding: 10px;
}

View file

@ -0,0 +1,51 @@
#header {
color: black;
}
#header .navigation {
font-size: 12px;
}
#header .navigation .border .outside {
color: blue;
}
#header .logo {
width: 300px;
}
#header .logo:hover {
text-decoration: none;
}
a b ul li {
color: green;
}
div .cool {
color: green;
}
p .cool span {
color: yellow;
}
div another {
color: green;
}
p another span {
color: yellow;
}
b .something {
color: blue;
}
b.something {
color: blue;
}
.foo .bar .qux,
.foo .baz .qux {
display: block;
}
.qux .foo .bar,
.qux .foo .baz {
display: inline;
}
.qux .foo .bar .biz,
.qux .foo .baz .biz {
display: none;
}
b hello [x="&yeah"] {
color: red;
}

View file

@ -0,0 +1,6 @@
#header .navigation .border .outside { color:blue; }
#header .navigation { font-size:12px; }
#header .logo:hover { text-decoration:none; }
#header .logo { width:300px; }
#header { color:black; }
a b ul li { color:green; }

View file

@ -0,0 +1,72 @@
.class {
color: #a2a2a2;
display: block;
}
.zero {
zero: 0;
one: 1;
two: 2;
three: 3;
}
.one {
one: 1;
one-req: 1;
two: 2;
three: 3;
}
.two {
two: 2;
three: 3;
}
.three {
three-req: 3;
three: 3;
}
.left {
left: 1;
}
.right {
right: 1;
}
.border-right {
color: black;
border-right: 4px;
}
.border-left {
color: black;
border-left: 4px;
}
.only-right {
right: 33;
}
.only-left {
left: 33;
}
.left-right {
both: 330;
}
#hola {
color: blue;
}
#defaults_1 {
height: one;
height: two;
height: three;
height: four;
}
.thing {
color: red;
}
#aa {
color: green;
color: blue;
color: red;
}
#bb {
color: green;
color: blue;
color: red;
}
#cc {
color: blue;
}

View file

@ -0,0 +1,11 @@
body div other world {
height: 50;
}
div other world {
height: 50;
}
pre {
height: 10;
height: 11;
height: 12;
}

View file

@ -0,0 +1,25 @@
something blue,
world {
color: blue;
}
.div (3434) {
height: 100px;
}
.div cool red {
height: 4000px;
}
.span5 {
color: 15;
}
.span4 {
color: 14;
}
.span3 {
color: 13;
}
.span2 {
color: 12;
}
.span1 {
color: 11;
}

View file

@ -0,0 +1,76 @@
default .underline {
border-bottom: 1px solid green;
}
default #header {
color: black;
border: 1px solid #dd44dd;
}
default #header .navigation {
font-size: 12px;
}
default #header .navigation a {
border-bottom: 1px solid green;
}
default #header .logo {
width: 300px;
}
default #header .logo:hover {
text-decoration: none;
}
variables .variables {
width: 14cm;
height: 24px;
color: #888;
background: #6c94be;
font-family: "Trebuchet MS", Verdana, sans-serif;
}
mixins .bordered {
border-top: dotted 1px black;
border-bottom: solid 2px black;
}
mixins #menu a {
color: #111;
border-top: dotted 1px black;
border-bottom: solid 2px black;
}
mixins .post a {
color: red;
border-top: dotted 1px black;
border-bottom: solid 2px black;
}
nested-rules #header {
color: black;
}
nested-rules #header .navigation {
font-size: 12px;
}
nested-rules #header .logo {
width: 300px;
}
nested-rules #header .logo:hover {
text-decoration: none;
}
namespaces #bundle .button {
display: block;
border: 1px solid black;
background-color: grey;
}
namespaces #bundle .button:hover {
background-color: white;
}
namespaces #header a {
color: orange;
display: block;
border: 1px solid black;
background-color: grey;
}
namespaces #header a:hover {
background-color: white;
}
mixin-functions body {
padding: 2.0em;
color: red;
margin: 10px;
height: 12px;
border-bottom: 1px solid green;
}

View file

@ -0,0 +1,19 @@
outer1: 44px;
outer2: 44px;
.variables {
width: 14cm;
height: 24px;
margin-top: -20px;
margin-bottom: 30px;
color: #888899;
background: #6c94be;
font-family: "Trebuchet MS", Verdana, sans-serif;
margin: 3px;
font: 10px/12px serif;
font: 120%/120% serif;
}
.external {
color: #888;
border: 1px solid #3326cc;
background: rgba(23,68,149,0.5);
}

View file

@ -0,0 +1,113 @@
#hidden {
color: transparent;
}
#hidden1 {
color: transparent;
}
.two-args {
color: blue;
width: 10px;
height: 99%;
border: 2px dotted black;
}
.one-arg {
width: 15px;
height: 49%;
}
.no-parens {
width: 5px;
height: 49%;
}
.no-args {
width: 5px;
height: 49%;
}
.var-args {
width: 45;
height: 17%;
}
.multi-mix {
width: 10px;
height: 29%;
margin: 4;
padding: 5;
}
body {
padding: 30px;
color: #f00;
}
.scope-mix {
width: 8;
}
.content {
width: 600px;
}
.content .column {
margin: 600px;
}
#same-var-name {
radius: 5px;
}
#var-inside {
width: 10px;
}
.arguments {
border: 1px solid black;
width: 1px;
}
.arguments2 {
border: 0px;
width: 0px;
}
.arguments3 {
border: 0px;
width: 0px;
}
.arguments4 {
border: 0 1 2 3 4;
rest: 1 2 3 4;
width: 0;
}
.edge-case {
border: "{";
width: "{";
}
.slash-vs-math {
border-radius: 0.4px;
border-radius: 0.5px;
border-radius: 6px;
}
.comma-vs-semi-colon {
one: a;
two: b, c;
one: d, e;
two: f;
one: g;
one: h;
one: i;
one: j;
one: k;
two: l;
one: m, n;
one: o, p;
two: q;
one: r, s;
two: t;
}
#named-conflict {
four: a, 11, 12, 13;
four: a, 21, 22, 23;
}
.test-mixin-default-arg {
defaults: 1px 1px 1px;
defaults: 2px 2px 2px;
}
.selector {
margin: 2, 2, 2, 2;
}
.selector2 {
margin: 2, 2, 2, 2;
}
.selector3 {
margin: 4;
}

View file

@ -0,0 +1,27 @@
.named-arg {
color: blue;
width: 5px;
height: 99%;
args: 1px 100%;
text-align: center;
}
.class {
width: 5px;
height: 19%;
args: 1px 20%;
}
.all-args-wrong-args {
width: 10px;
height: 9%;
args: 2px 10%;
}
.named-args2 {
width: 15px;
height: 49%;
color: #646464;
}
.named-args3 {
width: 5px;
height: 29%;
color: #123456;
}

View file

@ -0,0 +1,40 @@
#strings {
background-image: url("http://son-of-a-banana.com");
quotes: "~" "~";
content: "#*%:&^,)!.(~*})";
empty: "";
brackets: "{" "}";
escapes: "\"hello\" \\world";
escapes2: "\"llo";
}
#comments {
content: "/* hello */ // not-so-secret";
}
#single-quote {
quotes: "'" "'";
content: '""#!&""';
empty: '';
semi-colon: ';';
}
#escaped {
filter: DX.Transform.MS.BS.filter(opacity=50);
}
#one-line {
image: url(http://tooks.com);
}
#crazy {
image: url(http://), "}", url("http://}");
}
#interpolation {
url: "http://lesscss.org/dev/image.jpg";
url2: "http://lesscss.org/image-256.jpg";
url3: "http://lesscss.org#445566";
url4: "http://lesscss.org/hello";
url5: "http://lesscss.org/54.4px";
}
.mix-mul-class {
color: blue;
color: red;
color: black;
color: orange;
}

57
vendor/leafo/lessphp/tests/sort.php vendored Normal file
View file

@ -0,0 +1,57 @@
<?php
error_reporting(E_ALL);
require realpath(dirname(__FILE__)).'/../lessc.inc.php';
// sorts the selectors in stylesheet in order to normalize it for comparison
$exe = array_shift($argv); // remove filename
if (!$fname = array_shift($argv)) {
$fname = "php://stdin";
}
class lesscNormalized extends lessc {
public $numberPrecision = 3;
public function compileValue($value) {
if ($value[0] == "raw_color") {
$value = $this->coerceColor($value);
}
return parent::compileValue($value);
}
}
class SortingFormatter extends lessc_formatter_lessjs {
function sortKey($block) {
if (!isset($block->sortKey)) {
sort($block->selectors, SORT_STRING);
$block->sortKey = implode(",", $block->selectors);
}
return $block->sortKey;
}
function sortBlock($block) {
usort($block->children, function($a, $b) {
$sort = strcmp($this->sortKey($a), $this->sortKey($b));
if ($sort == 0) {
// TODO
}
return $sort;
});
}
function block($block) {
$this->sortBlock($block);
return parent::block($block);
}
}
$less = new lesscNormalized();
$less->setFormatter(new SortingFormatter);
echo $less->parse(file_get_contents($fname));