diff options
Diffstat (limited to 'mod/less/vendors/lessphp/tests/inputs')
26 files changed, 1553 insertions, 0 deletions
diff --git a/mod/less/vendors/lessphp/tests/inputs/accessors.less.disable b/mod/less/vendors/lessphp/tests/inputs/accessors.less.disable new file mode 100644 index 000000000..37f5c8e8b --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/accessors.less.disable @@ -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]; +} + + diff --git a/mod/less/vendors/lessphp/tests/inputs/arity.less b/mod/less/vendors/lessphp/tests/inputs/arity.less new file mode 100644 index 000000000..a3adad612 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/arity.less @@ -0,0 +1,77 @@ + +// simple arity + +.hello(@a) { + color: one; +} + +.hello(@a, @b) { + color: two; +} + +.hello(@a, @b, @c) { + color: three; +} + + +.world(@a, @b, @c) { + color: three; +} + +.world(@a, @b) { + color: two; +} + +.world(@a) { + color: 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) { + color: two; +} + +.foo(@a, @b: cool, @c: yeah) { + color: three; +} + + +.baz(@a, @b, @c: yeah) { + color: three; +} + +.baz(@a, @b: cool) { + color: two; +} + + +.multi-foo { + .foo(1); + .foo(1, 1); + .foo(1,1,1); +} + +.multi-baz { + .baz(1); + .baz(1, 1); + .baz(1,1,1); +} + + diff --git a/mod/less/vendors/lessphp/tests/inputs/attributes.less b/mod/less/vendors/lessphp/tests/inputs/attributes.less new file mode 100644 index 000000000..7ede4fc4e --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/attributes.less @@ -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; } + diff --git a/mod/less/vendors/lessphp/tests/inputs/builtins.less b/mod/less/vendors/lessphp/tests/inputs/builtins.less new file mode 100644 index 000000000..ae2c4ef6e --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/builtins.less @@ -0,0 +1,36 @@ +// builtin + +@something: "hello world"; +@color: #112233; +@color2: rgba(44,55,66, .6); + +body { + color: @something; + + @num: 7 / 6; + height: @num + 4; + height: floor(@num) + 4px; + height: ceil(@num) + 4px; + + @num2: 2 / 3; + width: @num2; + width: round(@num2); + width: floor(@num2); + width: ceil(@num2); + width: round(10px / 3); + + color: rgbahex(@color); + color: rgbahex(@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)); +} + + diff --git a/mod/less/vendors/lessphp/tests/inputs/colors.less b/mod/less/vendors/lessphp/tests/inputs/colors.less new file mode 100644 index 000000000..d407a74f3 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/colors.less @@ -0,0 +1,122 @@ + +body { + color: hsl(34, 50%, 40%); + color: hsla(34, 50%, 40%, 0.3); + + lighten: lighten(#efefef, 10%); + lighten: lighten(rgb(23, 53, 231), 22%); + lighten: lighten(rgba(212, 103, 88, 0.5), 10%); + + darken: darken(#efefef, 10%); + darken: darken(rgb(23, 53, 231), 22%); + darken: darken(rgba(23, 53, 231, 0.5), 10%); + + saturate: saturate(#efefef, 10%); + saturate: saturate(rgb(23, 53, 231), 22%); + saturate: saturate(rgba(23, 53, 231, 0.5), 10%); + + desaturate: desaturate(#efefef, 10%); + desaturate: desaturate(rgb(23, 53, 231), 22%); + desaturate: desaturate(rgba(23, 53, 231, 0.5), 10%); + + spin: spin(#efefef, 12); + spin: spin(rgb(23, 53, 231), 15); + spin: spin(rgba(23, 53, 231, 0.5), 19); + + spin: spin(#efefef, -12); + spin: spin(rgb(23, 53, 231), -15); + spin: spin(rgba(23, 53, 231, 0.5), -19); + + one: fadein(#abcdef, 10%); + one: fadeout(#abcdef, -10%); + + two: fadeout(#029f23, 10%); + two: fadein(#029f23, -10%); + + + three: fadein(rgba(1,2,3, 0.5), 10%); + three: fadeout(rgba(1,2,3, 0.5), -10%); + + four: fadeout(rgba(1,2,3, 0), 10%); + four: 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; + + zero: saturate(#123456, -100%); + zero: saturate(#123456, 100%); + zero: saturate(#000000, 100%); + zero: saturate(#ffffff, 100%); + + zero: lighten(#123456, -100%); + zero: lighten(#123456, 100%); + zero: lighten(#000000, 100%); + zero: lighten(#ffffff, 100%); + + zero: spin(#123456, -100); + zero: spin(#123456, 100); + zero: spin(#000000, 100); + zero: spin(#ffffff, 100); +} + + +alpha { + // g: alpha(red); + g: alpha(rgba(0,0,0,0)); + g: alpha(rgb(155,55,0)); +} + +fade { + f: fade(red, 50%); + f: fade(#fff, 20%); + f: fade(rgba(34,23,64,0.4), 50%); +} + +@a: rgb(255,255,255); +@b: rgb(0,0,0); + +.mix { + color: mix(@a, @b, 50%); +} + +.percent { + per: percentage(0.5); +} + +// color keywords + +.colorz { + color: whitesmoke - 10; + color: spin(red, 34); +} + + + +// 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%); +} + + diff --git a/mod/less/vendors/lessphp/tests/inputs/compile_on_mixin.less b/mod/less/vendors/lessphp/tests/inputs/compile_on_mixin.less new file mode 100644 index 000000000..79d628f49 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/compile_on_mixin.less @@ -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; +} diff --git a/mod/less/vendors/lessphp/tests/inputs/escape.less b/mod/less/vendors/lessphp/tests/inputs/escape.less new file mode 100644 index 000000000..02d92d6f0 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/escape.less @@ -0,0 +1,20 @@ + +body { + @hello: "world"; + border: e("this is simple"); + border: e(this is simple); // bug in lessjs + border: e("this is simple", "cool lad"); + border: e(1232); + border: e(@hello); + border: e("one" + 'more'); // no string addition lessjs + border: e(); // syntax error lessjs + + line-height: ~"eating rice"; + line-height: ~"string cheese"; + line-height: a b c ~"string me" d e f; + line-height: ~"string @{hello}"; +} + +.class { + filter: ~"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='image.png')"; +} diff --git a/mod/less/vendors/lessphp/tests/inputs/font_family.less b/mod/less/vendors/lessphp/tests/inputs/font_family.less new file mode 100644 index 000000000..c7186b57b --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/font_family.less @@ -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; +} + + diff --git a/mod/less/vendors/lessphp/tests/inputs/guards.less b/mod/less/vendors/lessphp/tests/inputs/guards.less new file mode 100644 index 000000000..20bdf240e --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/guards.less @@ -0,0 +1,88 @@ + +.simple(@hi) when (@hi) { + color: yellow; +} + + +.something(@hi) when (@hi = cool) { + color: red; +} + +.another(@x) when (@x > 10) { + color: green; +} + + +.flipped(@x) when (@x =< 10) { + color: teal; +} + +.yeah(@arg) when (isnumber(@arg)) { + color: purple; +} + + +.yeah(@arg) when (ispixel(@arg)) { + color: silver; +} + + +.hello(@arg) when not (@arg) { + color: orange; +} + +dd { + .simple(true); + .simple(2344px); +} + +b { + .something(cool); + .something(birthday); +} + +img { + .another(12); + .another(2); + + .flipped(12); + .flipped(2); +} + +body { + .yeah("world"); + .yeah(232px); + .yeah(232); + + .hello(true); +} + +.something(@x) when (@x) and (@y), not (@x = what) { + color: blue; +} + +div { + @y: true; + .something(true); + +} + +pre { + .something(what); +} + + +.coloras(@g) when (iscolor(@g)) { + color: true @g; +} + +link { + .coloras(red); + .coloras(10px); + .coloras(ffjref); + .coloras(#fff); + .coloras(#fffddd); + .coloras(rgb(0,0,0)); + .coloras(rgba(0,0,0, .34)); +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/hacks.less b/mod/less/vendors/lessphp/tests/inputs/hacks.less new file mode 100644 index 000000000..e69b7bf98 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/hacks.less @@ -0,0 +1,6 @@ +// css hacks + +:root .alert-message, :root .btn { + border-radius: 0 \0; +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/import.less b/mod/less/vendors/lessphp/tests/inputs/import.less new file mode 100644 index 000000000..250d1a3f3 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/import.less @@ -0,0 +1,21 @@ + +@import 'file1.less'; // file found and imported + +@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"; +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/keyframes.less b/mod/less/vendors/lessphp/tests/inputs/keyframes.less new file mode 100644 index 000000000..e65a38b95 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/keyframes.less @@ -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; + } + +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/math.less b/mod/less/vendors/lessphp/tests/inputs/math.less new file mode 100644 index 000000000..3f4af2c7d --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/math.less @@ -0,0 +1,116 @@ + +.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 + + sub: 10-5; + sub: 10 - 5; + + add: 10+5; + add: 10 + 5; + + // div: 10/5; // this wont work, read on + div: 10 / 5; + + mul: 10*5; + mul: 10 * 5; +} + +// these properties have divison not in parenthases +.supress-division { + border-radius: 10px / 10px; + border-radius: 10px/10px; + border-radius: hello (10px/10px) world; + @x: 10px; + font: @x/30 sans-serif; + font: 10px / 20px sans-serif; + font: 10px/20px 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); + div: (10 /5); + div: (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 { + hello: -(1px); + hello: 0-(1px); + + @something: 10; + hello: -@something; +} + + +// and now here are the tests + +.test { + single: (5); + single: 5+(5); + single: (5)+((5)); + + parens: (5 +(5)) -2; + // parens: ((5 +(5)) -2); // FAILS - fixme + + math: (5 + 5)*(2 / 1); + math: (5+5)*(2/1); + + width: 2 * (4 * (2 + (1 + 6))) - 1; + height: ((2+3)*(2+3) / (9-4)) + 1; + padding: (2px + 4px) 1em 2px 2; + + @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); +} + +.percents { + color: 100 * 10%; + color: 10% * 100; + color: 10% * 10%; + + color: 100px * 10%; // lessjs makes this px + color: 10% * 100px; // lessjs makes this % + + color: 20% + 10%; + color: 20% - 10%; + + color: 20% / 10%; +} + +.misc { + x: 10px * 4em; + y: 10 * 4em; + +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/media.less b/mod/less/vendors/lessphp/tests/inputs/media.less new file mode 100644 index 000000000..0e65d942f --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/media.less @@ -0,0 +1,38 @@ +@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; } +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/misc.less b/mod/less/vendors/lessphp/tests/inputs/misc.less new file mode 100644 index 000000000..86bd8f706 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/misc.less @@ -0,0 +1,84 @@ + +@hello: "utf-8"; +@charset @hello; + +@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"; + background: url(@var); + background: url(@{var}); + background: url("@{var}"); +} + +.mix(@arg) { color: @arg; } +@aaa: aaa; +@bbb: bbb; +// make sure the opening selector isn't too greedy +.cool {.mix("@{aaa}, @{bbb}")} +.cool(); + +.cool("{hello"); +.cool('{hello'); + + +// merging of mixins +.span-17 { float: left; } +.span-17 { width: 660px; } + +.x {.span-17;} + +.hi { + pre { + color: red; + } +} + +.hi { + pre { + color: blue; + } +} + +.rad { + .hi; +} + + +@page :left { margin-left: 4cm; } +@page :right { margin-left: 3cm; } +@page { margin: 2cm } + diff --git a/mod/less/vendors/lessphp/tests/inputs/mixin_functions.less b/mod/less/vendors/lessphp/tests/inputs/mixin_functions.less new file mode 100644 index 000000000..fc9d57901 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/mixin_functions.less @@ -0,0 +1,40 @@ + +@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; +} + +.skip_args { + @class(,12px); + @lots(,,,88px,,12px); + @group > @f(red,,,,); + @group > @f(red); +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/mixin_merging.less.disable b/mod/less/vendors/lessphp/tests/inputs/mixin_merging.less.disable new file mode 100644 index 000000000..6b25e421f --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/mixin_merging.less.disable @@ -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; +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/mixins.less b/mod/less/vendors/lessphp/tests/inputs/mixins.less new file mode 100644 index 000000000..259db3def --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/mixins.less @@ -0,0 +1,126 @@ + +@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; +} + + +.butter { + .this .one .isnt .found; +} + + +// 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); +} + + + + diff --git a/mod/less/vendors/lessphp/tests/inputs/nested.less b/mod/less/vendors/lessphp/tests/inputs/nested.less new file mode 100644 index 000000000..0b62ea19b --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/nested.less @@ -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; + } +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/pattern_matching.less b/mod/less/vendors/lessphp/tests/inputs/pattern_matching.less new file mode 100644 index 000000000..e875473d3 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/pattern_matching.less @@ -0,0 +1,167 @@ + +.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); + .hola(jello, world); +} + +.resty(@hello, @world, @the_rest...) { + padding: @hello @world; + rest: @the_rest; +} + +#nnn { + .body(10, 10, 10, 10, 10); + .body(10, 10, 10); + .body(10, 10); + .body(10); + .body(); +} + +.defaults(@aa, @bb:e343, @cc: "heah", ...) { + height: @aa; +} + +#defaults_1 { + .defaults(); + .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); +} + + + diff --git a/mod/less/vendors/lessphp/tests/inputs/scopes.less b/mod/less/vendors/lessphp/tests/inputs/scopes.less new file mode 100644 index 000000000..0ddbfac20 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/scopes.less @@ -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; +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/selector_expressions.less b/mod/less/vendors/lessphp/tests/inputs/selector_expressions.less new file mode 100644 index 000000000..a16c1d23a --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/selector_expressions.less @@ -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); + + diff --git a/mod/less/vendors/lessphp/tests/inputs/site_demos.less b/mod/less/vendors/lessphp/tests/inputs/site_demos.less new file mode 100644 index 000000000..136a99ac8 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/site_demos.less @@ -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; + } +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/test-imports/file1.less b/mod/less/vendors/lessphp/tests/inputs/test-imports/file1.less new file mode 100644 index 000000000..658de0c53 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/test-imports/file1.less @@ -0,0 +1,16 @@ + + +/** + * This is a test import file + */ + +@colors { + div.bright { + color: red; + } + + div.sad { + color: blue; + } +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/test-imports/file2.less b/mod/less/vendors/lessphp/tests/inputs/test-imports/file2.less new file mode 100644 index 000000000..2cae8dce0 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/test-imports/file2.less @@ -0,0 +1,6 @@ + +b { + color: @color; + padding: 16px; +} + diff --git a/mod/less/vendors/lessphp/tests/inputs/variables.less b/mod/less/vendors/lessphp/tests/inputs/variables.less new file mode 100644 index 000000000..6c4ef8fb4 --- /dev/null +++ b/mod/less/vendors/lessphp/tests/inputs/variables.less @@ -0,0 +1,45 @@ +@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; + padding: @nonexistant + 4px; +} + +@hello: 44px; +@something: "hello"; +@cool: something; + +color: @@something; +color: @@@cool; + + |