css preprocessor - Run LESS mixin only once -


i trying make sure mixin may called several times in different files, outputs css once.


first try (less)

i first thinking this:

mixin

@_mod: "false"; .mod(@_mod) when (@_mod = "false") {     @_mod: "true";      .mod {         border-radius: 6px;         border: 1px solid gray;     } } 

call 1

.mod(@_mod); 

call 2

.mod(@_mod); 

output

.mod {   border-radius: 6px;   border: 1px solid gray; } .mod {   border-radius: 6px;   border: 1px solid gray; } 

that doesn't work because variables namespaced , scoped mixins. reade more

codepen


second try (less)

i though this:

mixin

@_mod: "false"; .mody() {     .mody {         border-radius: 6px;         border: 1px solid gray;     } } 

call 1

& when (@_mod = "false") {     .mody(); } @_mod: "true"; 

call 2

& when (@_mod = "false") {     .mody(); } @_mod: "true"; 

output

-nothing-

this doesn't work because of less's lazy loading "feature" variables...

codepen


question

does know way make sure mixin, called multiple times, runs once?

solution: use default() , make initial mixin expose yet empty mixin (which suppress default one).

// (using same name mixin , ruleset bad idea)  ._mod() when (default()) {     ._mod() {}     .mod {         border-radius: 6px;         border: 1px solid gray;     } }  ._mod(); ._mod(); ._mod(); ._mod(); 

Comments

Popular posts from this blog

php - failed to open stream: HTTP request failed! HTTP/1.0 400 Bad Request -

java - How to filter a backspace keyboard input -

java - Show Soft Keyboard when EditText Appears -