less

I have a mixin that creates a gradient with vendors' prefixes, and I would like to add this background to a DIV in addition to another background-image . .horizontal(@start-color: #555; @end-color: #333; @start-percent: 0%; @end-percent: 100%) { background:@start-color; background-image: -webkit-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); background-image: -o-linear-gradient(left, @start-color @start-percent, @end-color @end-percent); background-image+: linear-gradient(to right, @start-color @start-percent, @end-color @end-percent); background-repeat: repeat-x;

I am trying to step up my game as far as my folder structure and workflow is considered. I have recently discovered that front end package management and automation of tasks are key to improve speed, decreasing dev time, decrease file size and increase profit. My issue is I am not too sure what the best method of using these tools are. I have a builds folder, which includes a dev and prod folder. My components are outside this folder in the bower_components folder. I usually customise bootstrap and take advantage of it's variables file and mixins. I have copied the bootstrap.less file, and the

I'm trying to create a progress indicator - and to a certain extent I've done it, but it's not what I want to end up with. Here's an image: As you can see the indicator shows 1 third, 2 thirds, then full. This is what I want to achieve except that I want the first, second and third sections to be different colors, so I would end up with 3 equal slices in 3 different colors starting at 12 o'clock. Here's the code - I've removed the centre section because it's not relevant to the question: ( the CSS is in Less syntax ) .timeline { h3 { position:relative; & > .step { background-color:@accentColor

Live demo here: http://codepen.io/KenPowers/pen/Ddfqh Consider the following LESS code: // Hide all list items by default and make internal labels have pointer cursors li { display: none; label { cursor: pointer; } } // This function generates selectors and corresponding css .gen (@tag) { @sel: ~"#@{tag}:checked"; @{sel} { & ~ ul > li[data-index~=@{tag}] { display: list-item; } & ~ ul > li > label[for=@{tag}] { color: red; } } } // Generate required selectors and css .gen("foo"); .gen("bar"); .gen("baz"); It generates the following CSS: li { display: none; } li label { cursor: pointer; } #foo

There is no less css command line compiler in mac osx. But I am trying out a project which needs to use less css. Also less is used to compress the css files in the project. How do I handle this? I read in less website that its js can be run on a node.js server - http://lesscss.org/#-server-side-usage But I am not understanding how to integrate it with django. What should be the value for the COMPRESS_PRECOMPILERS ? COMPRESS_PRECOMPILERS = ( ('text/less',""), ) Any help appreciated from someone who has already solved this problem. Install node.js and npm (I used homebrew to install node.js and

Needed something like this: gulp.src(path.join(conf.paths.src, '/**/*.less')) .pipe($.less()) // already have some result, but HUGE changes are needed .pipe(HERE_I_GET_IT_AS_A_TEXT(function(str){ // a lot of different changes return changed_str; })) .pipe(rename('styles.css')) // go on doing smth with changed_str .pipe(gulp.dest('./app/theme/')); Is there something in gulp to get some transitional result as text, process text with js and pass it to the next pipes? Everywhere I find only solution with reading files directly, this way is pointless for me. Use map-stream : var gulp = require(