.mixin(@a; @color) { ... }
.line {
.mixin(@color-new; #888);
}
.mixin(dark; @color) {
color: darken(@color, 15%);
}
.mixin(light; @color) {
color: lighten(@color, 15%);
}
@color-new: dark;
.line {
.mixin(@color-new; #FF0000);
}
<!doctype html> <head> <title>Pattern Matching</title> <link rel="stylesheet" href="style.css" type="text/css" /> </head> <body> <h2>Example of Pattern Matching</h2> <p class="myclass">Welcome to Yiibai Yiibai...</p> </body> </html>
.mixin(dark; @color) {
color: darken(@color, 15%);
}
.mixin(light; @color) {
color: lighten(@color, 15%);
}
@color-new: dark;
.myclass {
.mixin(@color-new; #FF0000);
}
lessc style.less style.css
.myclass {
color: #b30000;
}