3 ms·
I recently discovered Less (http://lesscss.org/ http://lesscss.org/), a CSS preprocessor that adds support for variables and many other features, like nested ru
by dcolgan 14y ago
I recently discovered Less (http://lesscss.org/ http://lesscss.org/), a CSS preprocessor that adds support for variables and many other features, like nested rules and mixins.
Using Less has been one of the most profound upgrades in my use of programming techniques in quite a while. Hopefully browsers will eventually support even more Less-like features.
- culturestate 14y agoIf you like Less, you should try Sass/SCSS (http://sass-lang.com/ http://sass-lang.com/) - same idea, but a little more powerful. Here's a good head-to-head: http://css-tricks.com/sass-vs-less/ http://css-tricks.com/sass-vs-less/
- rescripting 14y agoSince we're listing alternatives, I prefer Stylus (https://github.com/learnboost/stylus https://github.com/learnboost/stylus).
- hackinthebochs 14y agoI look a look at the sass-vs-less link, and I really don't see the draw of either. I don't want a turing-complete language in my css. Simple variable expansion will suffice--basically just syntactic sugar. I don't want yet another game of "find the definition" buried under a hierarchy of indirection. Perhaps its a lack of imagination on my part, but I can't think of a good use of this power for the purposes of styling a document.
- masklinn 14y agoI completely agree with you. That said, you can restrict your usage of these things. On the project I'm currently working on, we're only using three features: 1. constants (mostly for colors and a few sizes) 2. mixins/functions/macros for not-completely-standard properties (e.g. gradients, shadows), makes it easier to not forget a prefixed version, easier to update the definition when needed and much, much easier to read 3. nesting and continuations, especially for styling various states of e.g. a link (having to copy/paste a given selector 4 times and change the pseudo-class is no fun). Still requires some care though, overusing e.g. nesting can mean you find yourself with fucked up huge selectors in the final file.
- mnicole 14y agoLESS/Sass completely changes the speed it takes to write things out, cleans up the organizational composition and increases the readability of the file. While I use variables in it (and love it), that isn't the primary reason I do so. You don't play "find-the-definition" when you put all of your mixins as an index at the top.
- batista 14y ago>I look a look at the sass-vs-less link, and I really don't see the draw of either. Don't look at them, use then, and you'll see. >I don't want a turing-complete language in my css. Simple variable expansion will suffice--basically just syntactic sugar. And they are mostly that --simple variable expansion. But arithmetic is also handy, e.g .sidebar { width: @page_width - @content_width } That said, they are not turing-complete as far as I know. >I don't want yet another game of "find the definition" buried under a hierarchy of indirection. You never get that. You only have to look at the LESS or SASS file, never the generated CSS. And you can mentally map what you see in the browser's CSS inspector with the relevant LESS/SASS rule trivially. It's nothing like Coffeescript in this regard, where you (sometimes) have to hunt to see the original error.
- hackinthebochs 14y agoI appreciate the response. I'll have to give them an honest try before making a judgement.
- draegtun 14y agoI've yet to get into Less or SASS/SCSS because I'm still happy using a template engine (in my case Template::Toolkit) to manage my CSS. They do look nice but currently I still prefer not to blur the edges of what is or isn't CSS.