Revision: 63220
Updated Code
at April 18, 2013 20:13 by BuschFunker
Updated Code
// mixins to call inside loop .applyMixin('gridSpan', @index) { #grid > .span-width(@index); } .applyMixin('gridPush', @index) { #grid > .indent(@index); } .applyMixin('gridPull', @index) { #grid > .indent(-@index); } // helper class, will never show up in resulting css // will be called as long the index is above 0 .loop (@index, @class: item, @mixin: '') when (@index > 0) { // create the actual css selector // use (~'.@{class}_@{index}') for LESS version < 1.4 .@{class}_@{index} { // call styles through mixin .applyMixin(@mixin, @index); } // next iteration .loop(@index - 1, @class, @mixin); } // end the loop when index is 0 .loop (0) {}
Revision: 63219
Updated Code
at April 18, 2013 20:10 by BuschFunker
Updated Code
// mixins to call inside loop .applyMixin('gridSpan', @index) { #grid > .span-width(@index); } .applyMixin('gridPush', @index) { #grid > .indent(@index); } .applyMixin('gridPull', @index) { #grid > .indent(-@index); } // helper class, will never show up in resulting css // will be called as long the index is above 0 .loop (@index, @class: 'item', @mixin: '') when (@index > 0) { // create the actual css selector // use (~'.@{class}_@{index}') for LESS version < 1.4 .@{class}_@{index} { // call styles through mixin .applyMixin(@mixin, @index); } // next iteration .loop(@index - 1, @class, @mixin); } // end the loop when index is 0 .loop (0) {}
Revision: 63218
Updated Code
at April 17, 2013 02:22 by BuschFunker
Updated Code
// mixins to call inside loop .applyMixin('gridSpan', @index) { #grid > .span-width(@index); } .applyMixin('gridPush', @index) { #grid > .indent(@index); } .applyMixin('gridPull', @index) { #grid > .indent(-@index); } // helper class, will never show up in resulting css // will be called as long the index is above 0 .loop (@index, @class: 'item', @mixin: '') when (@index > 0) { // create the actual css selector .@{class}_@{index} { // call styles through mixin .applyMixin(@mixin, @index); } // next iteration .loop(@index - 1, @class, @mixin); } // end the loop when index is 0 .loop (0) {}
Revision: 63217
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at April 17, 2013 01:50 by BuschFunker
Initial Code
// mixins to call inside loop .applyMixin('gridSpan', @index) { #grid > .span-width(@index); } .applyMixin('gridPush', @index) { #grid > .indent(@index); } .applyMixin('gridPull', @index) { #grid > .indent(-@index); } // helper class, will never show up in resulting css // will be called as long the index is above 0 .loop (@index, @class: 'item', @mixin: '') when (@index > 0) { // create the actual css selector, example will result in // .myclass_30, .myclass_28, .... , .myclass_1 (~'.@{class}-@{index}') { // your resulting css .applyMixin(@mixin, @index); } // next iteration .loop(@index - 1, @class, @mixin); } // end the loop when index is 0 .loop (0) {}
Initial URL
Initial Description
Generate numbered classes and apply variable mixins. Base from [http://blog.thehippo.de/2012/04/programming/do-a-loop-with-less-css/](http://blog.thehippo.de/2012/04/programming/do-a-loop-with-less-css/)
Initial Title
LESS loop to generate classes
Initial Tags
class
Initial Language
CSS