Use less to generate dynamic CSS rules based on parameter value and passed mixin -


it possible achieve in less?

.some-button(@classname) {   @classname { .actionicon; }   tr:hover {     @classname { .actionbutton; }   } } 

when call it:

.some-button(.edit-action); 

the expected output should :

.edit-action { .actionicon; } tr:hover { .edit-action { .actionbutton; } } 

currently i'm getting "unrecognized input in @classname { .actionicon; }" error:

.some-button(@classname) {   @classname { .actionicon; }   tr:hover { 

edit

another thing achieve use mixin mixin parameter:

.actionbutton(@buttonclassname; @buttontype) {   @{buttonclassname} {      .actionicon;    }   tr:hover {     @{buttonclassname} {          .actionhovericon;          @buttontype();     }   } } 

and call this:

.actionbutton(~'.row-edit', button-harmful); 

where button-harmful mixin.

they call "selector interpolation", correct syntax is:

.some-button(@classname) {     @{classname} {          /* ... */     } }  // usage: .some-button(~'.edit-action'); 

or alternatively (if know use classes, i.e. . prefixed selectors) this:

.some-button(@classname) {     .@{classname} {         /* ... */     } }  // usage: .some-button(edit-action); 

Comments

Popular posts from this blog

python - Subclassed QStyledItemDelegate ignores Stylesheet -

java - HttpClient 3.1 Connection pooling vs HttpClient 4.3.2 -

SQL: Divide the sum of values in one table with the count of rows in another -