less

In C, sort usually implements as in the following example: #include <stdio.h> void Sort( int* arr, int n, bool(*cmp)(int,int) ) { for( int i=0; i<n-1; i++ ) { for( int j=i+1; j<n; j++ ) { if( cmp(arr[i], arr[j]) ) swap( arr[i], arr[j] ); } } } int ascending( int a, int b ) { return a > b; } // greater int descending( int a, int b ) { return a < b; } // less void main() { int arr[10] = { 1,3,5,7,9,2,4,6,8,10 }; // ascending Sort( arr, 10, ascending ); for( int i=0; i<10; i++ ) printf( "%d ", arr[i] ); printf( "\n" ); // descending Sort( arr, 10, descending ); for( int i=0; i<10; i++ ) printf( "

I have just recently gotten into LessCSS and I am running into what I feel is major limitation and I was wondering if there was a way to do this?? I want to say I read somewhere that Sass allows for user defined functions but will LessCSS do the same? What I'm wanting to do: @fs: 16; // either return the value .s(@t,@s,@u) { // return @t/@s*@u; } #elem { margin-top: .s(30,@fs,1em); width: .s(900,@fs,1em); .child { width: .s(100,900,100%); } } // or have a property argument .s(@t,@s,@u,@p) { @{p}: @t/@s*@u; } #elem { .s(30,@fs,1em,margin-top); .s(900,@fs,1em,width); .child { .s(100,900,100%

I wish to remove border radius from all the elements in Bootstrap. So I created custom-mixins.less and placed following lines in it, hopping that it would overwrite the original .border-radius mixin but didn't. // Border Radius .border-radius(@radius) { } So I tried following lines as an alternative which actually worked. // Border Radius .border-radius(@radius) { @radius : 0px; -webkit-border-radius: @radius; -moz-border-radius: @radius; border-radius: @radius; } I tried some mixins at http://less2css.org . It seems that less instead of overwriting the mixins, appends all the properties from

I have a collection of li , each with different background colors like these: &.menu-white { background-color: @product-white; color: darken(@product-white, 20%); } &.menu-green { background-color: @product-green; color: darken(@product-green, 20%); } &.menu-yellow { background-color: @product-yellow; color: darken(@product-yellow, 20%); } &.menu-black { background-color: @product-black; color: lighten(@product-black, 20%); } &.menu-red { background-color: @product-red; color: darken(@product-red, 20%); } Now I need to make the background color darkens according to its current background color

This is the first time I'mn building a site using LESS and encountered a problem best described by the code below: @section-row-padding-size-xs: 30px; @section-row-padding-size-sm: 50px; @section-row-padding-size-md: 100px; @section-row-padding-size-lg: 140px; .section-row-padding( @size ) { @padding-size: ~"@{section-row-padding-size-@{size}}"; .section-row { padding: @padding-size 0; &.quarter-padding-top { padding-top: @padding-size * 0.25; } &.quarter-padding-bottom { padding-bottom: @padding-size * 0.25; } &.half-padding-top { padding-top: @padding-size * 0.5; } &.half-padding-bottom {

I have some basic mixins that apply some rules using media queries .on-small(@rules) { @media (@minWidthSmall) { @rules(); } } .on-medium(@rules) { @media (@minWidthMedium) { @rules(); } } // and .on-large, .on-x-large and so on And I'm trying to build a very simple flex-based grid system, I'm trying to pass the mentioned mixins as parameters so I can have a generic .make-column mixin. as follows: .make-col(@break-point-mixin, @span, @size) { flex: 1; box-sizing: border-box; /*********************************************************** Is the following line possible in LESS somehow? ***********

I'm using SASS for a project and so far I'm pretty satisfied with it. However I have some code that should only be presented for IE 7 and below, using the class name .ie-lt8 for that. But when i extend that selector in SASS, with a nested selector i create multiple selectors. Example (extending a display: inline-block code for IE): SASS /* My extension code */ .ie-lt8 %ie-inline-block { display: inline; zoom: 1; } /* I want the li to be inline-block */ #my-ul li { display: inline-block; @extend %ie-inline-block; } CSS produced /* My extension code */ .ie-lt8 #my-ul, #my-ul .ie-lt8 li { display

I have a problem with sprites background position calculation using a variable: My code looks something like this: @counter: 1; #my-icon-bundle { .my-icons () { #my-icon-bundle .myIconX("classX1", @counter); #my-icon-bundle .myIconX("classYY1", @counter); ... } .myIconX(@name, @index) { @nameText: ~".my-icon-@{name}"; @{nameText} { #my-icon-bundle .myIcon(@index); } @counter: @index + 1; } .myIcon(@row) { @x: some calculations based on @row @y: some calculations based on @row background-position: -@x -@y; } } The problem is that the @counter increment does not work properly, and all icons